Piotr Tekien GAR1-B Grafische Vormgeving Revisie portfoliostijl 3 december 2014 PIOTR TEKIEN HKU GAME ART GAR-1B
INHOUDSOPGAVE Inhoudsopgave Revisie Portfoliostijl 1 Inleiding 1 Vergelijking eigen site 1 www.swiftfreeze.com 1 studenthome.hku.nl/~piotr.tekien/ 2 Design punten 2 Re design 2 studenthome.hku.nl/~piotr.tekien/ 3 Re design V1 3 Re design V2 3 Waarom deze stijl? 4 Swiftfreeze.com Foto s 1 studenthome.hku.nl/~piotr.tekien/ 3 FINAL RE DESIGN (V3) 6 Mindmap 6 Moodboard 1 Prototype 1 Conclusie & uitleg 1
Revisie Portfoliostijl INLEIDING Opdracht: Hou je portfolio home pagina, intropagina kritisch tegen het licht. Op basis van de voorgaande lessen heb je nu genoeg munitie om te gaan kijken wat er niet direct communiceert. Ik weet wat er fout is aan mijn site. Dit ligt niet aan het ontwerp, maar aan de doelgroep waar ik mijn site voor heb gemaakt. Natuurlijk zijn er punten die verbeterd kunnen worden, dit zijn dan punten die vaak mening gebonden zijn en dat is voor ieder persoon verschillend. VERGELIJKING EIGEN SITE Als ik mijn eigen site (www.swiftfreeze.com) vergelijk met de site die ik voor HKU heb gemaakt, dan zijn er inderdaad een aantal punten die anders zijn. WWW.SWIFTFREEZE.COM Mijn eigen site is nog zakelijk, dat wil ik voorlopig zo houden. Het werk komt in ieder geval sterk naar voren. Homepage Op de homepage heb ik bijvoorbeeld een full screen slideshow. Onder de slideshow staat een korte informatieve introductie Onder de introductie staan mijn diensten, wat ik kan bieden aan iemand. About Op de About pagina (My Passion) vertel ik over mijn passie en wat ik heb gedaan de afgelopen jaren. Verder vertel ik wat mijn vaardigheden zijn en staat mijn CV onderaan de pagina. Portfolio Op de Portfolio pagina zijn er 3 categoriee n: Games, 3D & Photoshop. Contact Op de contact pagina staat een map van google en een marker waar ik woon in Hilversum inclusief een contactformulier zoals op de site van HKU. Page 1 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
STUDENTHOME.HKU.NL/~PIOTR.TEKIEN/ About Op de about pagina heb ik een container die opgedeeld is in 3 blokken: een foto van mij, mijn studierichting en mijn favoriete game. Daar onder staat een verhaal over mijn passie, die ook te vinden is op mijn eigen website. Log Het logboek was dus specifiek gericht op de site van HKU. In dit logboek vertel ik elke week hoe mijn ervaring was van die week op school. Dit kan van alles bevatten. HKU Op de HKU pagina wordt natuurlijk al het huiswerk dat bedoeld is voor de docenten gezet. Deze functie heeft weinig nut op een site om jezelf als Artist te verkopen. Vandaar dat ik los van dit mijn eigen site heb, Portfolio Op mijn portfolio pagina is deze opgedeeld net als mijn eigen site. Hier staat het werk voorlopig in pdf s. Contact Op de contact pagina staat een simpel contactformulier die niet werkt omdat de school zijn server niet heeft aangezet. DESIGN PUNTEN Het design van mijn eigen site is natuurlijk anders dan die van de site die bedoeld is voor HKU. Op mijn portfolio site voor HKU was de bedoeling om alles simpel te houden en overzicht te cree ren voor de leraren om het werk te kunnen vinden die zij zoeken. Het design voor HKU moest er strak uitzien naar mijn mening en ik vind dat ik dat doel bereikt heb. Eventueel zou ik misschien een andere font kunnen gebruiken op mijn eigen site. Verder kan ik ook de site vormen naar hoe mijn eigen site opgebouwd is, maar persoonlijk vind ik dit onnodig omdat het nu alleen informatie bevat dat van belang is. RE DESIGN Ik heb toch geprobeerd een re-design te maken in combinatie met mijn eigen website. Het is nu een mix tussen HKU gericht en bedrijf gericht. Na de afgelopen les heb ik besloten om een 2 e versie te maken van mijn re design. Dit keer los van alles. Page 2 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
STUDENTHOME.HKU.NL/~PIOTR.TEKIEN/ RE DESIGN V1 RE DESIGN V2 Page 3 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
WAAROM DEZE STIJL? Re design V1 In de 1 e re design heb ik een combinatie gemaakt van mijn eigen website met die van HKU. Naar mijn persoonlijke mening werd dit te druk voor een homepagina. Aangezien ik een combinatie heb van de richtlijnen van HKU en mijn eigen site. Daarom heb ik een 2 e versie gemaakt. Re design V2 In mijn 2 e versie heb ik alle richtlijnen losgelaten en specifiek gericht voor de klant. Zoals in de les besproken werd heb ik mijn werk op de homepage naar voren laten springen door een grote slider aan de bovenkant te zetten. Verder onderaan de pagina is (nieuw/mooi) werk ingedeeld in 3 kolommen, wanneer er op de plaatjes word geklikt, komt er een lightbox met een vergrootte versie en aan de rechterkant informatie over het werk. Ook dacht ik aan een Step by step button die laat zien hoe mijn workflow van die opdracht was op dat moment. Verder heb ik een zoekfunctie rechtsboven geplaatst en snelle contactinformatie linksboven. Page 4 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
SWIFTFREEZE.COM FOTO S Page 1 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
Page 2 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
STUDENTHOME.HKU.NL/~PIOTR.TEKIEN/ Page 3 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
Page 4 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
Page 5 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
FINAL RE DESIGN (V3) FINAL RE DESIGN (V3) MINDMAP Page 6 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
FINAL RE DESIGN (V3) MOODBOARD Page 1 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
FINAL RE DESIGN (V3) PROTOTYPE Page 1 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014
FINAL RE DESIGN (V3) CONCLUSIE & UITLEG In mijn 3 e en laatste versie heb ik de feedback van de feedback les opgenomen en verwerkt in mijn laatste ontwerp. In dit ontwerp heb ik besloten om een combinatie te doen van 4 dingen: Mijn structuur & orde in het leven die ik in de les heb uitgelegd Het gebruik van mijn skills waar ik goed in ben (3D) Het gebruik van een website (showcase) Een HUD die activeert op de middelmuis click van de muis (zoals in crysis om sneller te navigeren zie voorbeeld) Als eerste ben ik begonnen met een mindmap om neer te zetten wat ik precies zoek om mijzelf uniek te stellen boven anderen en welke boodschap ik wil overbrengen naar mijn publiek. Deze mindmap heb ik aangehouden tijdens het ontwerpen van mijn 3 e design. Hierbij heb ik een moodboard gemaakt om de sfeer te cree ren welke richting het op gaat. Aan de bovenkant van mijn website is zoals gewoonlijk, de navigatiebalk, deze hoort mee te kleuren afhankelijk van hoe laat het is op het moment dat de bezoeker mijn pagina bekijkt. Verder staat onder de navigatiebalk waar je je op het moment begeeft. De gebruiker kan dan een stap van 1 of 2 naar achteren gemakkelijk springen. Tijdens het bekijken van het portfolio werk kan de gebruiker de middelmuisknop ingedrukt houden om informatie te krijgen over het portfolio item (compact = less is more). Tijdens het bezoeken van mijn portfolio wordt de gebruiker geleid door middel van korte 3D animaties, waarbij het thema uitfade en infade naar een nieuw thema die af hangt van het type portfolio item. Het clicken van de middelmuisknop zal dan werken op basis van een lightbox systeem die automatisch opent op hover van een subcategorie als PROCES en open blijft nadat je de middelmuisknop los laat. Verder kan de gebruiker naar beneden scrollen om naar het volgende portfolio item te gaan in plaats van terug te gaan naar het overzicht van alles. Page 1 PIOTR TEKIEN HKU GAME ART GAR-1B 3 december 2014