STAGEVERSLAG LEON VAN ZIJL - 3VA2
HENK BIJKERK FLORIS DE LANGEN
4 FEB TOT EN MET 5 JULI
INLEVERDATUM 28 MEI
DE INLEIDING In dit stageverslag ga ik in detail uitleggen hoe
school. Aangezien ik al aardig wat wist van de
mijn eerste echte ervaring met mijn stage is
Adobe programma’s lette ik te weinig op in de
verlopen, waar ik stage heb gelopen, waar ik
klas en toonde ik niet genoeg interesse. Na een
allemaal met trots aan heb mogen werken, welke
aantal gesprekken met mijn SLB-er hebben we
nieuwe manieren van werken ik heb geleerd en
toch besloten dat ik het weer zou gaan proberen
nog veel meer. Maar natuurlijk moeten we bij het
en er alles aan zou gaan doen om over te gaan.
begin beginnen.
Dit, samen met de motivatie die ik kreeg van mijn klas, zorgde ervoor dat ik achteraf over ben
Mijn interesses vóór het Grafisch Lyceum Utrecht,
gegaan. Terugkijkend hierop zou ik het beter
GLU, lagen altijd al bij grafisch vormgeving en
hebben aangepakt, maar ik heb er ook veel van
multimedia. Ik hield me er al vrij vroeg mee
geleerd.
bezig en genoot ervan om mijn vrijetijd eraan te besteden. Vandaar dat mij nooit een moeilijke
Verder is mijn tweede jaar, het jaar dat we een
keuze tegenmoet stond welke richting ik op wilde.
klas over hebben mogen slaan en direct vanuit
Na een aantal opendagen te hebben bezocht heb
1VA5S naar 3VA2 zijn gegaan, perfect verlopen.
ik voor het GLU gekozen, de school sprak me erg
Deed gewoon netjes al het werk, had zin om naar
aan en ik mocht er de versnelde opleiding volgen.
school te gaan en zetten me in voor de opdrachten die we moesten maken. Ondanks dat ik erg naar
Het begin van mijn eerste jaar liep echter
mijn stage periode uitkeek vond ik het wel jammer
behoorlijk stroef, na de eerste maand kelderde
om de klas niet meer dagelijks te zien.
mijn motivatie en deed ik niet meer me best op
03
INHOUDSOPGAVE PAGINA 03 PAGINA 07 PAGINA 13 PAGINA 25 PAGINA 37 PAGINA 39 PAGINA 43
05
INLEIDING UNC INC DE PROJECTEN ZELFREFLECTIE STAGE ERVARING STAGEVERSLAG BRONVERMELDING
o
ris
Flo
Martij n
Ro
e
Roderik
Ba
rry
UNCVERLEDEN - INC
-Zijn jullie begonnen in Amsterdam? Het merendeel van ons woonde om de hoek van ons kantoor. We waren ooit natuurlijk naar Amsterdam gekomen omdat je in onze branche gewoonweg meer mogelijkheden hebt in een stad
Interview met Floris de Langen:
als Amsterdam.
-Wanneer is Unc Inc opgericht?
-Hoe zijn jullie aan klanten gekomen?
Op 1 januari 2006 hebben we Unc Inc opgericht.
We namen klanten mee uit het freelance verleden. We hebben nooit iemand op actieve sales gehad.
-Waarom waren jullie met Unc Inc begonnen?
Vrijwel iedere nieuwe klant komt binnen via
Het merendeel van de 5 oprichters werkten al
andere klanten en resultaten. Nu nog steeds en
jaren daarvoor samen als freelancers.
dat is eigenlijk ook de meest gezonde manier.
Echter werkte ieder onder zijn eigen naam en
-Hoe liep het met de zaken tijdens de crisis?
we maakten individueel offertes voor dezelfde
We zijn bewust klein gebleven, wat ervoor zorgde
klanten. Door samen onder 1 naam verder te
dat we weinig overhead hebben en concurrerend
gaan, konden we klanten een totaal pakket
kunnen werken. Daarnaast is de helft van bedrijf
aanbieden en tegelijkertijd veel overhead
aandeelhouder en we zouden onszelf minder
besparen.
salaris kunnen uitkeren als er te weinig binnen komt.
07
HEDEN
UI en UX design waarbij de gebruiker centraal
Op dit moment bestaat Unc Inc uit 6 vaste
huisstijlen, logo’s, jaarverslagen te combineren
werknemers die er full time werken.
met verschillende platformen en digitale
Waaronder Eltjo Smit, hij is de projectmanager
toepassingen. Online en social campagnes
en zorgt ervoor dat een project netjes ingepland
waarmee ze op elk raakvlak de doelgroep
staat en dat alles op tijd af komt. Ook doet hij
bereiken en betrekken via cross-media. Als
regelmatig samen met Roel van de Wal de
laatste houden ze ook alle statistieken en
communicatie met de klant. Verder maakt Roel
analyses van de projecten in de gaten waardoor
de eerste wireframes. Na goedkeuring worden
ze de kwaliteit en prestaties kunnen blijven
de wireframes uitgewerkt door Floris de Langen,
verbeteren.
staat. Web en mobiele ontwikkelingen waar het mogelijk is om schaalbare systemen voor verschillende platformen te ontwikkelen. Merk en identiteit ontwerpen waaronder complete
mijn stagebegeleider en vormgever bij Unc Inc. Nadat het ontwerp rond is en de klant er tevreden mee is, komen we aan op het technische aspect van het project. Dit wordt uitgewerkt door Roderik de Langen, Martijn Houtman en Barry Tielkes, dit zijn allen ontwikkelaars en Barry helpt tussendoor ook wel eens aan de vormgeving. Verder is er
MOTIVATIE
een deeltijd werknemer, genaamd Jelle die
Het eerste wat je van een bedrijf ziet is hun
verantwoordelijk is voor de werkende Android
website, bij Uni Inc zag dit er erg professioneel,
applicaties. Uiteindelijk zijn er nog 3 stagiairs,
strak en clean uit in vergelijking tot enkele
Gaby de Bast die bezig is met de social media
concurrenten. Wat zorgde voor een goede eerste
van Unc Inc, Daan Brittan is een ontwikkelaar en
indruk. Als eerste ben ik door hun portfolio heen
“grammatica nazi” en ikzelf, als vormgever.
gelopen en kwam ik een aantal interessante projecten tegen, waaronder Fitapp, Smart Pulse
Unc Inc combineert creativiteit met technologie.
en Valerio’s Dating Game. Ook merkte ik dat Unc
Ze bieden onderzoeken en strategieën aan
Inc meer gefocust was op digitale producten waar
waardoor ze inzichten en doelstelling naar
ik zeker een voorkeur naar heb. Verder waren de
merk- en marketingstrategieën kunnen vertalen.
portret foto’s op de website handig en doordat
ze er allemaal op een humoristische manier op
stage te laten lopen. Wel vonden ze het handig dat
stonden wist je meteen dat het niet al te zakelijk
ik eerst nog een gesprek met Floris zou hebben,
was.
aangezien hij mijn uiteindelijke stagebegeleider zou worden. Ook dit ging goed en zodoende werd ik na het invullen van de papieren officieel een
SOLLICITATIE Voordat ik Unc Inc contacteerde wilde ik er wel voor zorgen dat mijn portfolio er zo goed mogelijk
VERWACHTING
uit zag. Wat in hield dat ik nog wel het een en
stagiair bij Unc Inc.
het ander aan mijn website moest veranderen.
Ondanks dat ik al twee gesprekken met Unc Inc
Enkele codeer fouten moesten eruit worden
heb gehad en iedereen ondertussen als wel eens
gehaald en wat recentere projecten werden
persoonlijk had gezien was alsnog een nieuwe
toegevoegd. Nadat dat allemaal gedaan was kon
spannende ervaring waar ik niet vroeg genoeg
ik beginnen met mijn eerste benadering. Omdat
aan kon beginnen. Mijn verwachtingen waren erg
ik mijn portfolio al meteen aan hun wilde laten
hoog, of dit handig is is een tweede want dan zou
zien voor een goede eerste indruk en zodat hun
het eigenlijk alleen maar kunnen tegenvallen
meteen wisten waarvoor ik stage wilde lopen
maar daar kon ik vrij weinig aan doen.
schreef ik een e-mail naar Floris. Daarin stond
Ik wilde gewoon beginnen, het echte werk in,
een korte introductie, motivatie, informatie over
geen schooldagen waarbij je de minuut dat je op
de stage en uiteraard over mijn portfolio website.
school was hoorde dat het eerste uur uitviel, aan
Aangezien het weekend was verwachte ik geen
serieuze opdrachten werken en geen huiswerk
e-mail terug voor een werkdag maar hoopte ik
meer als je thuis komt.
hoe dan ook op een goed antwoord. En tot mijn vreugde, werd ik maandag uitgenodigd voor een gesprek. Eenmaal aangekomen bij Unc Inc bleek Floris ziek te zijn en had ik een gesprek met Barry en Roel, dit verliep allemaal heel soepel en hun zagen er niets op tegen om mij bij Unc Inc
09
EVALUATIE GESPREK
voor mijn stageverslag gemaakt en een simpele
Na 2 maanden leek het Floris en mij verstandig
nemen. Toen alles gepland was konden we ook
om even een evaluatie gesprek te houden. Dit
kijken hoeveel tijd ik er per week mee bezig
ter controle van mijn ervaring tot nu toe en om
kon zijn en hoefde het niet tussen de Unc Inc
overzichtelijke planning. Hierna heb ik met Floris afgesproken om een eerste snelle opzet te maken in InDesign zodat we ongeveer konden schatten hoeveel tijd alle onderwerpen in beslag zouden
even wat dingen voor mij stageverslag door te nemen. Floris gaf aan dat ik kwalitatief goed werk oplever en een goede vormgever ben van boven gemiddeld niveau. Wel een opmerking aan zijn kans was mijn motivatie tijdens minder leuke opdrachten, hij merkte dat ik op dat moment minder me best deed en minder gemotiveerd
VASTE “RITUELEN”
was. Dit is vrij logisch natuurlijk maar het is
projecten door.
slecht zodra het mijn productiviteit verminderd,
Maandag:
wat gebeurde. Verder gaf Floris zelf aan dat hij een betere balans tussen leuke en minder leuke
Vergadering
10:00 - 11:00
opdrachten zou geven zodat ik altijd iets had om
Hiervoor gaan we met zijn alle rondom een
mee af te wisselen.
grote tafel in een aparte kamer zitten, zetten we het televisie scherm die overzichtelijk tegen
Ook was er wat onduidelijkheid over mijn
de muur hangt aan en bespreken we de actuele
stageverslag. Want de prioriteit van mijn
projecten aan de hand van 10000ft. Dit is een
stageverslag lag anders bij Floris en mezelf.
website met een ingebouwde planning. Hierin
Aangezien ik al wel de indruk kreeg dat het
kan je per persoon zien wat iedereen gepland
op mijn stage goed zat, was het enige wat
heeft staan voor de komende weken en kan
ik verder voor school zou moeten afronden
iedereen individueel zijn eigen taken invullen
mijn stageverslag. Dit in combinatie met
en de uren hiervoor bijhouden. Ook kan je een
geen afspraken of planning zorgde voor al die
complete lijst van alle actieve projecten zien,
onduidelijkheid. Om dit op te lossen heb ik eerst
die nog eens onderverdeeld zijn tussen ‘Unc
een overzicht van wat er allemaal moet gebeuren
Inc projecten’, ‘afwachtende projecten’ en
‘belangrijke projecten’. Iedereen die betrokken is bij het besproken project laat weten hoe ver diegene is met zijn of haar taak en wat er nog moet gebeuren. Dit zorgt ervoor dat er geen enkel project wordt overgeslagen en dat iedereen helderheid heeft over de projecten. Dinsdag: Inspirational Tuesday
18:00 – 21:10
Dit is een maandelijkse “teambuilding-achtige” activiteit geïntroduceerd door Gaby. Hierin laten we allemaal nieuwe en handige programma’s zien, inspirerende projecten of gewoon leuke video’s die je bent tegengekomen. Dit allemaal onder het genot van een biertje en pizza is natuurlijk erg goed te doen. Ook zorgt het ervoor dat er niet meer onderling e-mails worden verstuurd binnen werknemers maar dat het gedeeld wordt met iedereen. Vrijdag: Warme broodjes
13:00 – 13:30
Bij de lunch worden er op vrijdag altijd als extraatje warme broodjes gehaald. Special Lunch
13:00 - 14:00
Eens in de zoveel weken is er een special lunch. Dit wordt door iemand van het Unc Inc team voorbereid en houdt in dat we een extra lekkere lunch krijgen, zoals Pizzabroodjes.
11
DESMART DICEPROJECTEN ze bedacht om het te combineren met een app,
zodat ze eenvoudig en duidelijk de werking van de Bluetooth dobbelsteen kunnen laten zien.
Het concept van Diasemi komt neer op een
simpele variant van het craps en / of roulette Mijn eerste officiële opdracht bij Unc Inc. Van
spel die je in casino’s tegenkomt. Dit houdt in dat
tevoren was besproken dat ik zou werken aan de
je een speelveld te zien krijgt met de nummers
portfolio van Unc Inc maar achteraf dacht Floris
1 tot en met 6, omdat dit het limiet van een
dat dit een leuk alternatief was.
dobbelsteen is, en daar een chip op kan plaatsen, Hoeveel chips en of je de chip tussen 4 cijfers
Diasemi, een al eerdere klant van Unc Inc, kwam
in kan plaatsen was nog niet duidelijk, het was
met de vraag of wij een applicatie (‘app’) voor
immers een begin concept. Als je ingezet hebt
op de iPhone gebaseerd op een concept van hun
zou je op een knop ‘Klaar!’ kunnen klikken zodat
zouden kunnen ontwikkelen. Dit was uiteraard
de app weet dat je op dit moment gaat dobbelen.
mogelijk. Het concept was behoorlijk simpel,
Komt je dobbelsteen op een winnend getal uit
Diasemi heeft een dobbelsteen ontwikkeld die
wordt je winst verdubbeld, zo niet verlies je de
je via Bluetooth kan verbinden aan je mobiel.
inzet. Kwa design had Diasemi nog niets bedacht
Dit houdt in dat je mobiel kan registeren of je
dus daar waren we vrij in behalve dat het ‘Smart
dobbelsteen aan het rollen is of dat hij op een
Dice’ zou moeten heten, wat wij ook een passende
bepaald nummer stil ligt. Om dit te pitchen aan
naam vonden.
eventuele investeerders voor Diasemi hebben
13
Mijn taak als vormgever was best
ook nodig hadden waren chips, hiervoor had ik
vanzelfsprekend, maak het design van de app. Wel
een basis gemaakt in Illustrator en er details aan
werd ik tot mijn verbazing behoorlijk los gelaten.
toegevoegd in PhotoShop. Wel moesten achteraf
Ik mocht mijn eigen ideeĂŤn visualiseren en mijn
de waardes van de 3 verschillend gekleurde
eigen beslissingen maken wat wel en niet mooi
chips weggehaald worden. Dit omdat de app
was. Roel had een aantal wireframes voor me
niet zo ingewikkeld gecodeerd zou worden om
klaarliggen met alle vensters die vormgegeven
het te herkennen en bij de winstverdeling mee
moesten worden. In totaal waren dit er 8; loading,
te rekenen. Uiteindelijk zag het er al uit als een
connecting, betting, rolling 1, rolling 2, won, lost
complete app maar miste de dobbelsteen nog, die
en retry. Tussen het proces door besloten we een
we in eerste instantie 3D hadden gemaakt voor de
paar vensters te verwijderen omdat ze niet veel
verschillende aanzichten. Maar dat bleek achteraf
toevoegde en alleen maar extra werk zouden zijn.
niet bij de stijl van de rest te passen. Nadat alle wireframes ontworpen waren was het alleen nog
Aangezien het gebaseerd is op een casino spel
nodig om een app icon te maken aan de hand van
besloot ik ook om dat thema aan te houden en
een handige PhotoShop template.
duidelijke casino kenmerken aan het design toe te voegen. Beginnende met een achtergrond
Toen het helemaal af was kwam ik er achter dat
gemaakt van groen vilt met een strakke houten
je in totaal veel meer moet ontwerpen dan je in
rand eromheen en een logo van casino-achtig
eerste instantie bedenkt. Van tevoren bedacht ik
gestijlde letters werkte al erg goed en het
me niet dat ik alle 6 kanten van een dobbelsteen
begon er al netjes uit te zien. Maar niet alles
moest vormgeven, zowel de knoppen normaal als
ging meteen goed, je blijft dingen uitproberen,
ingedrukt moest vormgeven en overal minimaal
meerdere varianten maken en vergelijken om
2 varianten van moest ontwerpen (niet verplicht,
te kijken wat nou het beste past. Dit gold ook
maar het gebeurde automatisch).
voor de notificaties en de knoppen. We waren er niet helemaal zeker van hoe we dit het beste
Over het algemeen heb ik behoorlijk wat geleerd
konden weergeven, eventueel wilden we een
met dit project, van grootte wijziging in mijn
pop-up maken in de stijl van een boekrol voor de
werkstijl tot kleine details. Het feit alleen al dat
notificaties. Achteraf werkte dit totaal niet. Verder
ik nu met anderen samen aan ĂŠĂŠn PhotoShop
probeerde we houten blokken zoals de rand in
bestand werk houdt al in dat ik stukken netter
de achtergrond waarbij we meteen al merkte dat
met mijn lagen om moet gaan zodat het allemaal
het veel beter mengde met het geheel. Wat we
geordend blijft.
15
Passend bij het opschonen van me .PSD’s kwam het werken met Smart-Objects. Waar ik uiteraard al wel eens van heb gehoord en mee heb gewerkt, in ieder geval Vector Smart-Objects, maar waar ik me nooit in heb verdiept. Hier ga ik een aantal pagina’s verder in mijn stageverslag dieper op in. Ook leerde ik dat we zowel rekening met de resolutie van een iPhone 5 én 4 moesten houden, wat 176 pixels in de hoogte verschilt. Aangezien ik op de hoogste resolutie was begonnen betekende dit dat ik overal behoorlijk wat ruimte over moet houden zodat het ook mogelijk was alle elementen op de resolutie van een iPhone 4 te krijgen. En kwam ik erachter dat de knoppen van een app niet kleiner dan 40 x 40 pixels mogen zijn, je zowel de afbeeldingen normaal moet exporteren en met ‘@2x’ achter de naam (dus: naamhier@2x.png) voor de iPhone 5. Maar ook gewoon denken in de trend van een app; hoe het interface makkelijk werkt, wat een efficiënte manier is van het plaatsen van de objecten, de stijl van het design en nog wel een aantal andere kleine details. Dit is zeker een project waar ik heel erg trots op ben, wat ik meestal niet vond van de projecten op school. Dit zal er zeker mee te maken hebben dat we nog nooit een applicatie hebben ontworpen op school, maar ook omdat ik gewoon meer gemotiveerd was. Het was een goed project als introductie binnen Unc Inc en zeker “portfolio waardig”.
19
GRAPHICMAIL
Mijn taak was het gedeeltelijk helpen met het
Graphicmail is een website voor e-mailmarketing.
Gemiddeld hadden alle pagina’s rond de 3
Unc Inc was verantwoordelijk voor het nieuwe
graphics nodig en elke graphic was verschillend
website design. Dit hield in dat we meerdere
want het moest aansluiten op het stukje tekst
verschillende pagina’s moesten ontwerpen
ernaast. Toen ik eenmaal na een aantal graphics
en coderen zoals, de blog, login pagina en de
te hebben gemaakt de stijl duidelijk had, was
prijzenlijst. Verder hebben we ook een eigen
het bedenken van het juiste icoon van de titel
Graphicmail Facebook pagina ontworpen waar
overduidelijk het lastigst. Aangezien het geen
mensen zichzelf kunnen inschrijven voor de
animaties werden moest ik met één afbeelding
nieuwsbrief.
duidelijk maken waar het tekstvlak over ging.
uitwerken van het design van de pagina’s, op het moment dat de algemene stijl al duidelijk was. Ik ben met de footer, content, en header bezig geweest maar voornamelijk met de graphics.
De communicatie tussen Guus, contactpersoon vanuit Graphicmail, en Unc Inc ging voornamelijk
Tijdens dit project heb ik niet specifiek technische
via Mockflow.
handigheidjes geleerd. Ik heb voornamelijk logisch leren nadenken over de iconen. Hoe je
“Mockflow is een website waar je heel gemakkelijk al een basisopzet kan maken voor websites. Je kan kolommen en rijen aanmaken, afbeeldingen toevoegen en tekst, wat je daaruit weer kan selecteren en kopiëren.”
gemakkelijk en zo simpel mogelijk bepaalde titels kan vertalen naar beeld en constant dezelfde stijl aan te houden. Verder heb ik ook geleerd wat Mockflow precies inhoud en wat je er allemaal mee kan. Zelf zal ik het niet zo snel gebruiken maar een mogelijke klant wel. Kwa ervaring was het erg leuk, je merkt dat een
Tijdens het proces paste Guus constant wat
pagina vorm begint te krijgen door de graphics.
pagina’s / teksten aan en zorgde wij dat ze strak
Ook mocht ik zelf de stijl uitkiezen waarmee
vormgegeven werden en dat het er professioneel
de klant tevreden was, dus dat was een leuke
uit kwam te zien.
ervaring. Verder was het ook leuk om een aantal pagina’s volgens het basis design te ontwerpen.
21
PATCHWORDS
erover deed. Ik was het project begonnen met
Patchwords is een initiatief van Unc Inc zelf.
PhotoShop te gaan gebruiken. Natuurlijk is het
Het is een gratis app waarmee je woorden kan
voordeel van Illustrator vectoren en een kleine
creëren in verschillende stijlen. Nadat je een
bestandsgrootte dus in plaats van een 500 x 500
woord hebt getypt, kan je per letter uitkiezen
pixel resolutie gebruikten we voor PhotoShop
welke stijl je daarvoor wilt hebben. Daarna kan
3000 x 3000 pixels en duurde het opslaan / laden
je het gecreëerde woord opslaan en delen met
langer. Maar we kregen wel een grotere variatie
je vrienden. Ze willen de letterstijlen die op dit
aan letterstijlen.
Illustrator wat ook zeker aan de letters te zien is. Het heeft gewoon een minder realistisch gevoel dan met PhotoShop, waarbij je vrijwel alles kan. Vandaar dat we later besloten om ook
moment worden gebruikt vervangen door nieuwe, zelfgemaakte stijlen.
Door Patchwords heb ik beter met artboards leren omgaan en enkele kleine nieuwe functies
Mijn taak was om nieuwe letterstijlen te creëren,
ontdekt. Verder het ik voor PhotoShop met ‘Layer
en behoorlijk veel ook. Uiteindelijk willen ze
Comps’ gewerkt. Dit zijn lagen voor verschillende
dat alle oude letterstijlen worden vervangen.
composities, in dit geval verschillende letters.
Aangezien ik er meerdere moest maken besloot
In plaats van een groep standaard lagen uit te
ik om een template in Illustrator te maken, 37
vinken en de andere groep aan kan je nu gewoon
artboards (26 letters, 10 cijfers en een spatie),
met een simpele klik wisselen tussen een geheel
alles gecentreerd in hun eigen artboard, de
andere indeling van je standaard lagen.
juiste resolutie met de mogelijkheid om snel het lettertype aan te passen.
Op zich was het een leuke opdracht, wel verkies
Tijdens het project had ik wel even moeite met
ik het om veel tijd in één lettertype te steken in
de tijd die ik per letter eraan kon besteden.
plaats van andersom. Omdat ik niet al te lang aan
Aangezien je sommige stijlen gewoon 37 keer kan
één alfabet kon werken koos ik merendeel voor
kopiëren voor de andere letters / cijfers, maar
een stijl die makkelijk te kopiëren was. Terwijl de
dat werkt niet bij elke stijl. Wat ervoor zorgt dat
mooiste stijlen diegene waren waar de meeste
het minstens twee keer zo lang duurt. Ook was
tijd in zat, wat vanzelfsprekend is. Uiteraard is dat
het van belang dat er een aantal specifieke stijlen
ook weer hoe het eraan toegaat als je voor geld
inzaten waarbij het niet uitmaakt ehoelang ik
werkt, er is gewoon een limiet aan uren en dan moet je verder.
23
BETTER BE TOGETHER Better be Together was voor mij een erg kort project. Het zal uiteindelijk een spel zijn die te spelen is op een internet browser. Ze hebben aan Unc Inc gevraagd om de identiteit vorm te geven inclusief de gehele website waarom het spel gespeeld wordt. Floris had van tevoren al een aantal creaties voor het logo naar ze opgestuurd maar kon er niet helemaal achter komen wat ze precies zochten. Mijn taak binnen dit project was een opzet voor het logo te creëren en één pagina van de website. Het logo is in tegenstelling tot andere logo’s gemaakt in PhotoShop, met behoorlijk wat detail. De reden hiervoor was simpelweg omdat ik het spel niet associeer met een simpel eenkleurig logo én daar kwam ook nog bij dat de logo’s van Floris niet werden goedgekeurd dus ik wilde een andere aanpak proberen. De website is gemaakt op basis van een wireframe, verder was ik helemaal vrij in het design en heb ik het strak en professioneel vormgegeven. In totaal was het leuk om aan te hebben mogen gewerkt. Ik ben zelf trots op het design voor de website en hoop dan ook dat het een stap in de goede richting is voor Better be Together.
25
46
ZELFREFLECTIE LEERDOEL 1
Niemand vindt het leuk om een hele dag aan één opdracht te zitten en het is ook een makkelijke manier om snel verveeld te raken. Zelf bedacht ik me dat het handig was
Mijn eerste leerdoel is ‘Meer doorzetten / niet
om mezelf uit te dagen als oplossing om
opgeven’. Ik heb dit leerdoel gekozen omdat het
gemotiveerd te blijven. Als ik me bezig hielt
wel eens voorkomt dat ik minder productief ben
met nieuwe technieken tijdens een project
bij opdrachten die niet heel leuk of interessant
bleef ik geïnteresseerd. Ook kon ik de projecten
zijn. Ik ben altijd al iemand geweest die
wat leuker maken dan ze daadwerkelijk zijn.
gemotiveerd moet blijven, als ik dat niet ben; doe
Bijvoorbeeld met Patchwords, als ik eenmaal de
ik minder goed me best, heb ik er weinig zin in,
letterstijl compleet had en die moet doorvoeren
stel ik het gauw uit en ga ik bezig met de leukere
voor de overige letters / cijfers kon ik ook per 5
opdrachten waar ik aan kan werken.
nieuwe letters cijfers iets toevoegen / veranderen zodat het niet 37 keer hetzelfde is. Hoe dan ook
Zoals ik al heb beschreven in de inleiding heeft
zal ik hieraan moeten blijven werken. Het was
dit mij al bijna genekt in het eerste jaar van
logisch dat sommige projecten minder leuk waren
de opleiding dus ik zal hier zeker aan moeten
maar dat betekende niet dat ik er minder mijn
werken. Ik heb dit leerdoel opgeschreven na mijn
best voor moest gaan doen.
evaluatie gesprek met Floris en we afgesproken dat ik meer zou afwisselen tussen projecten.
27
LEERDOEL 2
ik een duidelijk overzicht wat ik heb gedaan en hoelang ik er mee bezig ben geweest. Ook wordt het voordat de week begint als richtpunt ingevuld door Eltjo. Zodat je ongeveer weet waaraan je gaat werken de komende week.
Het tweede leerdoel houdt in dat ik beter mijn werk in wil plannen. De laatste tijd krijg ik het steeds drukker en kan ik het niet meer maken om opdrachten uit te stellen of er te lang aan te werken. Vandaar dit leerdoel. Dit leerdoel is deels verbonden met leerdoel 1.
LEERDOEL 3
Zoals ik al zei; ben ik niet gemotiveerd, stel ik
Mijn laatste leerdoel is ‘praktijk ervaring opdoen’.
opdrachten uit. In principe ben ik hier al een
Dit is natuurlijk in zekere zin het doel van je stage
tijdje mee bezig en gaat het al beter. Voor mijn
maar voor mij is het ook erg belangrijk. Ik wil
persoonlijke taken gebruik ik een app genaamd
niet alleen opdrachten maken voor Unc Inc, ik wil
Wunderlist, dit is een digitale takenlijst waarbij je
weten hoe alles er echt aan toegaat. Alles wat er
taken kan afvinken als je ze gedaan hebt. Voor de
nog meer bij komt kijken. Dit zal zeker van pas
belangrijke afspraken heb ik een agenda op mijn
komen als ik later full time ga werken voor een
mobiel om ervoor ze zorgen dat ik weet welke
bedrijf, me eigen bedrijf opricht of als freelancer
afspraken ik op welke dag heb en niet gestrest
verder ga.
raak omdat ik een afspraak ben vergeten. De reden dat dit beide op mijn mobiel staat is omdat
Door stage te lopen bij Unc Inc zal ik al erg veel
een daadwerkelijke takenlijst en agenda voor
leren, toch leek het me handig om een aantal
mij niet werkt. Ik neem ze niet mee, ik houd het
vragen te formuleren en aan Floris te stellen over
niet bij en ga er gewoon slordig mee om. Mijn
het verleden van Unc Inc. Dit samen met gewoon
mobiel heb ik daarin tegen altijd bij me dus kan ik
vragen tijdens gesprekken, stellen zal mij nog een
wanneer ik maar wil iets toevoegen.
groter beeld geven van hoe het er allemaal aan toe gaat.
Wat mij erg heeft geholpen in het plannen van de opdrachten bij Unc Inc is 10000ft. Door steeds de uren van mijn dag aan het einde in vullen, krijg
29
ACTIONS
en de action weer stopt, is de functie van die
Ik wilde wat dieper ingaan op actions. Tijdens
Wel is de manier waarop PhotoShop jouw
mijn stage wilde Unc Inc hun eigen portfolio
handelingen opneemt nogal geavanceerd. Stel
aanpassen. Voor hun portfolio plaatsen ze
mijn voorgrond kleur is wit en mijn achtergrond
alle gecreëerde websites in een net browser
kleur zwart (de standaard swatch kleuren) en
venster, voor app’s worden ze in een iPhone
je een action begint, daarin een nieuwe laag
of Android mobiel geplaatst of een iPad etc..
aanmaakt en met de ‘paint bucket tool (G)’ de
Hierdoor worden de ontworpen producten net en
laag wit maakt en dan de action stopt. Dan zal
professioneel gepresenteerd. Aangezien Unc Inc
je denken dat elke keer bij het afspelen van die
al aardig wat projecten achter de rug heeft,
action PhotoShop een nieuwe laag aanmaakt en
die allemaal ge-update moesten worden leek
die wit kleurt, dit is niet zo. PhotoShop registreert
het Barry en mij handig om een aantal actions
de action op deze manier.
action een nieuwe laag aanmaken. Om de handeling af te laten spelen kan je er dubbel op klikken in het action venster of de action aan een toets toewijzen (bijvoorbeeld; shift + F10).
hiervoor te maken zodat we niet alles handmatig moesten vernieuwen. Ook zullen ze hier profijt van hebben voor nieuwe projecten.
1. Nieuwe laag
De voordelen van een action is simpel, er wordt
2. Vullen:
een bepaalde handeling voor jou gedaan door één
Voorgrond kleur
keer te klikken. Wat voor handeling dat is, bepaal je helemaal zelf zolang je het maar zelf instelt. Je zal dus geen compleet webdesign voor je klant
Oftewel, de volgende keer dat je de action gebruikt
krijgen, maar als je je er eenmaal in verdiept
en je voorgrond kleur blauw is zal PhotoShop
verbaast het je hoeveel er mogelijk is.
een nieuwe laag aanmaken en die blauw kleuren. Wil je ondanks dat je voorgrond kleur niet wit is
Als je een action maakt neemt PhotoShop
de action het toch wit laten kleuren? Dan moet
eigenlijk gewoon op wat je aan het doen bent
je in plaats van de ‘paint bucket tool’ de ‘fill’
totdat je het opnemen stopt. Als je bijvoorbeeld
functie gebruiken. In dat geval zal PhotoShop dit
een action begint, dan een nieuwe laag aanmaakt
registreren:
1. Nieuwe laag 2. Vullen:
Kleur: #ffffff (wit) Tint: 180° Verzadiging: 0 Helderheid: 100 Ondrzchtigheid: 100% Mode: normaal
Action 1: 1. Creëer een vierkant 2. Speel ‘Action 4’ af Action 2: 1. Creëer een cirkel 2. Speel ‘Action 4’ af
Nu onthoudt PhotoShop de code voor de kleur wit dus het maakt niet uit wat je voorgrond kleur is. Wat ook leuk is, dat je met een action een andere action kan laten afspelen. Waarom? Omdat het enige voordelen heeft. Stel dat je meerdere
Action 3: 1. Creëer een driehoek 2. Speel ‘Action 4’ af
actions moet maken. Action 1 die een vierkant maakt, Action 2 die een cirkel maakt en Action 3 die een driehoek maakt. Máár daarnaast moeten alle actions de vormen ook blauw kleuren, horizontaal spiegelen en dupliceren. Je zou ze alle 3 apart kunnen opnemen. Maar aangezien het einde van de actions hetzelfde is, zou je ook een Action 4 kunnen maken die, ongeacht welke vorm het is de vorm blauw kleurt, horizontaal spiegelt en dupliceert en die laten afspelen door de oorspronkelijke actions (Action 1, 2 en 3). Zie het schema rechts hoe de actions eruit komen te zien.
31
Action 4: 1. Kleur:
#00b4ff (blauw)
2. Transformatie: Horizontaal 3. Dupliceer laag
De actions die ik voor Unc Inc moest maken waren echter wat gecompliceerder en ik zal stap voor stap door ĂŠĂŠn action heen gaan. De action is om een afbeelding met welke breedte / hoogte dan ook passend in een iPhone 5 te krijgen, de iPhone 5 in een canvas te plaatsen met een gradient als achtergrond. Als eerste moest ik een correcte foto van een iPhone 5 vinden. De resolutie van het scherm van een iPhone 5 is 1136 x 640 pixels. Dus ik had ook een foto nodig met diezelfde resolutie. Nadat ik dat had gevonden was het tijd voor de action. Zo ziet de action er ruwweg uit. Ik heb de benaming in het Engels gelaten voor de duidelijkheid.
1. Image Size 2. Set Selection 3. Copy 4. Open 5. Paste 6. Set Selection 7. Align current layer 8. Align current layer 9. Set Selection 10. Create Clipping Mask current layer 11. Make layer 12. Merge Visible 13. Set Selection 14. Copy 15. Close 16. Canvas Size 17. Paste 18. Select backward layer 19. Delete current layer 20. Canvas Size 21. Make layer 22. Move current layer 23. Gradient
1. Hier schalen we aan de hand van de breedte
4. Openen van een iPhone 5 PhotoShop bestand.
de afbeelding. Dit zorgt ervoor dat de afbeelding
Je kan met een action een bepaald bestand
de juiste resolutie krijgt en de verhouding van
openen zolang deze op dezelfde bestandslocatie
de afbeelding niet verandert. Waarom we aan
blijft staan toen je de action opnam. Dit is een
de hand van de breedte schalen is omdat de
PhotoShop bestand van de iPhone 5 bestaande uit
afbeeldingen wel langer dan het iPhone scherm
2 lagen. De eerste laag, genaamd ‘iPhone 5’, is de
mogen zijn maar niet dunner. Een afbeelding
iPhone zelf zonder het scherm. De tweede laag,
van 2272 x 1280 wordt verkleint naar 1136 x 640
genaamd ‘Achtergrond’, is een zwarte laag die
maar een afbeelding
het scherm moet voorstellen zodat de action weet
van 3000 x 1280 wordt
waar de afbeelding moet komen.
verkleint naar 1500 x 640. In dit geval is
5. Het plaatsen van de gekopieerde afbeelding in
de afbeelding langer
het iPhone 5 PhotoShop bestand.
dan het scherm (1500 – 1136 = 364 pixels te
6. Een selectie maken van de Achtergrond laag.
lang) en zullen de 364 pixels aan de onderkant
7. De afbeelding horizontaal op één lijn plaatsen,
van de afbeelding niet
met de selectie van de Achtergrond laag. Nu staat
te zien zijn.
de afbeelding dus verticaal goed.
2. Gehele canvas selecteren
8. De afbeelding met de bovenkant van de selectie op één lijn zetten, nu is de afbeelding
3. Afbeelding kopiëren
zowel verticaal als horizontaal correct. Waarom hij met de bovenkant gelijk wordt gezet en niet horizontaal is zodat er bij te lange afbeeldingen er alleen een stuk van de onderkant wordt verborgen. Als je bijvoorbeeld een te lange website in je iPhone wilt laten zien en je moet kiezen welk gedeelte dat is, kies je natuurlijk voor de bovenkant.
33
9. Deselecteren van de selectie.
17. De samengevoegde laag plakken in het canvas.
10. Clipping mask van de afbeelding maken in de Achtergrond laag. Dit zorgt ervoor dat je
18. Selecteren van de laag eronder, dit is de
het te lange gedeelte van de afbeelding ook
afbeelding die nog in het canvas staat waarmee
daadwerkelijk niet te zien krijg.
we begonnen.
11. Maken van een nieuwe laag.
19. Verwijderen van de oude afbeelding.
12. Alle lagen samenvoegen in de nieuwe laag.
20. De grote van de canvas veranderen naar 2181 x 1600 pixels vanuit het midden zodat de iPhone
13. Gehele canvas selecteren.
gecentreerd staat.
14. Samengevoegde laag (de iPhone 5 met de
21. Nieuwe laag aanmaken, deze komt standaard
afbeelding erin) kopiĂŤren.
boven de daarvoor geselecteerde laag te staan.
15. Sluiten van het iPhone 5 PhotoShop venster
22. Laag onder de samengevoegde laag plaatsen.
zonder het op te slaan. Aangezien dit bestand vaker wordt gebruikt moet je het laten zoals
23. Gradient maken in de nieuw gemaakte laag,
het oorspronkelijk geopend was. En omdat we
vanaf het middenpunt naar buiten toe.
niet tekens zelf het venster willen sluiten nadat de action klaar is, hebben we dit er ook aan toegevoegd. Ook zal PhotoShop na het sluiten van het venster automatisch naar het nog steeds geopende venster van de afbeelding terugkeren. 16. De grote van de canvas van het beginnende venster aanpassen naar 1604 x 773 pixels, dit zou zowel groter of kleiner dan de oorspronkelijke grote kunnen zijn. 1604 x 773 is de grote van de samengevoegde laag.
35
SMART-OBJECTS
op klikt, zal je hem niet verkleint in het smart
Op Unc Inc heb ik ook leren werken met smart
object venster toepassen.
object venster te zien krijgen. Ook zullen de smart filters, zoals het verscherpen ervan niet te zien zijn in het smart object venster. Dit kan wel, maar dan moet je de smart filter in het smart
objects. Ik had er al een aantal keren van gehoord en mee gewerkt maar niet in verdiept. Je kan van
Uiteindelijk heeft dit mijn manier van werken
elke laag in PhotoShop een smart object maken.
behoorlijk veranderd en veel effici毛nter gemaakt.
Wanneer je dat doet onthoudt PhotoShop hoe
Ik hoef geen duplicatie meer van mijn lagen te
de laag in elkaar zit. De voordelen hiervan zijn
maken omdat ik ze eventueel nog groter wil
behoorlijk groot. Je kan bijvoorbeeld een smart
maken. Het geeft je ook meer vrijheid en zorgt
object afbeelding verkleinen en daarna weer net
ervoor dat een aantal handeling sneller kunnen
zo makkelijk vergroten zonder dat de kwaliteit
worden uitgevoerd.
verloren gaat. Je kunt echter geen aanpassing direct aan de pixels van een smart object maken. Dus gummen en tekenen werkt niet. Wel kan je in tegenstelling tot een normale laag, een smart object verscherpen en daarna het effect weer aanpassen of verwijderen. Ook kan je een nieuw venster speciaal voor het smart object openen door er dubbel op te klikken. Hierin kan je net zoals normale PhotoShop bestanden meer lagen plaatsen en bewerken. Ironisch genoeg kan je er ook n贸g een smart object in maken, en in die weer een, enzovoort. Wel zal je in het smart object venster het smart object in zijn oorspronkelijke staat te zien krijgen. Dus als je hem hebt verkleint, er daarna dubbel
37
STAGE ERVARING In zekere zin heb ik er nu precies 3 maanden
aangaan. Ook doet een biertje op het dakterras
stage gelopen en vanwege de deadline is het ook
wonderen, je leert iedereen kennen en weet
onmogelijk om van mijn gehele stageperiode
waarvoor je het allemaal doet. Als je klakkeloos
een verslag op te schrijven. In ieder geval waren
de opdrachten maakt zonder het resultaat te zien
mijn verwachtingen erg hoog bij Unc Inc, ik vond
en te weten waarvoor je het nou precies doet, is er
de personen aardig en ze kwamen spontaan,
eigenlijk geen beginnen aan.
humoristisch en “niet al te zakelijk” over. Wel
Ook erg leuk om te zien is dat Unc Inc veranderd
heb ik een kleine keerpunt meegemaakt tijdens
en jij daar een deel vanuit maakt. Zoals de
mijn stage. Dit kwam voornamelijk omdat ik mijn
Inspirational Tuesdays die tegenwoordig
stageverslag tussendoor moest maken. Hier had
maandelijks worden gehouden, de special
ik in het begin geen duidelijk planning voor en
lunches en de nieuwe website met nieuwe
ook geen concrete afspraken met Floris gemaakt.
portfolio projecten. Waar ik ook erg tevreden
Dit in combinatie met een aantal “minder
over ben, is dat ik nog een aantal interessante
leuke” projecten, zorgden even voor een kleine
dingen heb mogen leren, zelfs met PhotoShop
tegenslag. Nadat ik met Floris rondom de tafel
(waar ik stiekem van tevoren niet vanuit ging). Dit
ben gaan zitten en alles had besproken, begon
alles neem ik zeker mee voor later en hopelijk is
het stukken beter te gaan. Ook kwam ik erachter
het leren nog niet ten einde aangezien ik nog 2
dat het project waar ik op dat moment mee bezig
maanden stage moet lopen. Unc Inc is voor mij
was stukken leuker was dan ik me voornam. Op
een geweldige eerste indruk geweest als stagiaire
dit moment voel ik me helemaal thuis bij Unc Inc,
en het zal mij echt benieuwen of de volgende
ik ken iedereen en kan makkelijk een gesprek
stage even leuk gaat worden.
39
STAGEVERSLAG CONCEPT met illustratief achtige lettertype. Ook leek het
mij wel leuk om als voorkant mijn bureau bij Unc Inc vorm te geven, met een beetje creativiteit.
Het concept van mijn stageverslag is ‘verandering’. Iedereen gaat stage lopen, komt terecht in een geheel andere omgeving en in zekere zin verandert je dagelijks leven. Ik ga niet meer naar school maar ben serieus aan het
INDELING
werk en krijg er ook wat voor terug, meer dan
Ik heb geprobeerd de meest logische en beste
alleen mijn stagevergoeding. Dit concept heb
indeling te vinden voor mijn stageverslag.
ik proberen te verwerken in mijn stageverslag
Beginnende natuurlijk met de titelpagina, inhoud
door een geheel andere techniek te gebruiken,
en inleiding. Dan heb ik besloten om eerst
illustratief. De meeste klasgenoten weten wel dat
alles over mijn stage zelf af te ronden, dus als
ik voornamelijk met PhotoShop werk en ondanks
eerste komt het stage bedrijf, als introductie
dat ik het nog steeds erg leuk vind heb ik het geen
zodat het makkelijker is om erover te vertellen
enkele keer geopend tijdens het maken van mijn
bij de volgende hoofdstukken. Daarachter
stageverslag. Alles is met Illustrator gemaakt.
komen de projecten waaraan ik heb gewerkt
Elk hoofdstuk heeft zijn eigen bijpassende
en de zelfreflectie. De projecten staan voor de
afbeelding of afbeeldingen, als het niet uitkwam
zelfreflectie omdat ik bij de zelfreflectie vertel
41
over technieken die ik heb geleerd bij een bepaald project wat nogal verwarrend zal zijn als je het project nog niet kent. Dan als afsluiting van het stage gedeelte is een korte conclusie van de stageperiode.
PLANNING
Als laatste komen de hoofdstukken over het verslag, de stukken over de vormgeving, formaat,
In het begin had ik nog geen enkel benul van
indeling, de bronnen die gebruikt zijn in het
hoelang ik precies bezig zou zijn aan me verslag.
verslag en dan de achterkant.
Wel was ik relatief gezien vroeg begonnen, maar zonder planning. Ook zat er behoorlijk wat tijd in mijn voorkant, omdat ik hiervoor er al één had
FORMAAT
gemaakt maar die achteraf niet mooi genoeg
Omdat ik mijn stageverslag bij Blurb laat
mezelf allemaal duidelijk op een rijtje stond.
afdrukken is het formaat standaard ingesteld op
Ik heb me ook behoorlijk goed aan de planning
‘magazine’. Dit houd in: 21,59 cm breed bij 27,94
gehouden en heb daardoor ook gewoon nog de tijd
cm hoog.
gehad om mijn stageverslag op te sturen naar de
was. Toen ik echt begon met het schrijven van de teksten kwam ik erachter dat ik een planning nodig zou hebben. Ik heb zowel een planning, als de complete inhoud gemaakt zodat het voor
praktijkbegeleider voor feedback. Aangezien dit ook een van me leerdoelen was ben ik blij dat het
BEELDMATERIAAL 99% van het beeldmateriaal is zelfgemaakt. Het enige echte beeldmateriaal wat ik in het verslag heb gebruikt zijn de portret foto’s van de Unc Inc werknemers.
43
allemaal netjes is verlopen.
BRONVERMELDING INSPIRATIE www.behance.net www.vimeo.com/27009476 www.issuu.com/lwlies/docs www.millamagazine.com www.f-i.com
INFORMATIE www.uncinc.com www.kuler.adobe.com
45