https://padlet.com/olivia_ponten/e9h28selxzjq Arbetsprocess för arbetsprov 3 i Grafisk design för Webben av Olivia en-us 2019-01-14 14:36:58 UTC 2025-10-29 16:05:03 UTC hello@padlet.com https://padlet-uploads.storage.googleapis.com/339357219/08e64222f038d37fa5e772b3635d6812/knapp.jpg olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318378 Skiss över portfolio-delen där små bilder och kortare beskrivningar av mina arbeten visas i kronologisk ordning]]> 2019-01-14 14:55:03 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318378 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318381 Skiss på om mig-sidan]]> 2019-01-14 14:55:03 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318381 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318383 Skiss på logotyp]]> 2019-01-14 14:55:03 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318383 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318385 skiss på potentiella banners för unicef]]> 2019-01-14 14:55:03 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320318385 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320339217 Logotyp för min portfolio.
Jag valde att använda knappen eftersom det signalerar att jag sysslar med hantverk, medans jag ville ha med läsbar text som länkar tillbaka till kommunikationsdelen av den verksamhet jag uppfunnit för den här uppgiften.]]> 2019-01-14 15:28:46 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320339217 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320355797 Screenshot av de lager jag arbetade i för min logotyp. Knappen, som skall fylla funktionen av bokstaven O i Olivia är gjord i två större, rödam fyllda ellips-lager där den översta har effekten "innerskugga" applicerad för att illustrera hur kanten på en knapp oftast är upphöjd. Hålen i knappen är också fyllda ellipser med "innerskugga" applicerad för att förstärka att de skall likna hål. Eftersom det är en ganska enkel design så har jag grupperat mina lager efter själva knappen (totalt 6 ellipser i tre lager) och text. Det räckte för att hålla koll på det jag arbetade med. 
Fonten jag använt kom med photoshop och är AR DECO samt Calibri i svart.]]> 2019-01-14 15:53:51 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/320355797 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/321753491 Jag använde mig av ett fotografi från bildbanken UnSplash som har en bank med bilder som privatpersoner så väl som företag får använda gratis. Hade jag haft möjlighet att göra och redovisa en animation hade jag visat bilden helt i färg först och sedan lagt det svartvita samt texten som ett lager som dyker upp efter någon sekund. 
Jag valde att göra två tredjedelar av bilden svartvita där jag la ett tyngre budskap om att smutsigt vatten dödar fler barn än krig på den svartvita sidan, medans "lösningen" på problemet och det ansvar vi vill att möjliga donatorer skall känna och ta för dessa barn hittar vi på den tredjedel av bilden som är i färg, tillsammans med unicefs logga, som jag hämtade från uppgiftens material. "gör skillnad på unicef.se" har samma färg som unicefs logotyp.]]> 2019-01-17 16:09:40 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/321753491 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/321761630 Jag valde en bild av ett barn som leker i vattnet eftersom jag tyckte om hens ansiktsuttryck. Vid första anblick ser hen glad ut, men jag anser att tittat man tillräckligt länge så är man inte lika säker på att barnet är glatt längre. Jag ville använda en bild på ett barn i en situation vi känner igen och kan se våra egna barn i - lekandes i vattnet. 
Jag ville skapa en kontrast inte bara i färgerna, utan också i det blandade budskapet. Vi ser ett barn som leker i vattnet, något vi sett många gånger förr, men jag vill ge de bekväma hemma bakom datorn att det vatten vi tar för givet att dricka, bada och leka i också är något som tar många barns liv.]]> 2019-01-17 16:21:14 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/321761630 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322505005 Jag skapade ikonerna för sociala medier att ha i min menyrad med hjälp av ellipsverktyget. Jag gjorde en fylld ellips i 100x100px. För tumblr och facebook lade jag till bokstaven "t" och "f" i fonten Tw Cen MT Condensed. För youtube skapade jag den triangelformade play-knappen med hjälp av magnetiska lasso-verktyget och fyllde den med vitt. Till instagram skapade jag en ofylld fyrkant med rundade hörn och lade en ofylld ellips samt en mindre fylld ellips innanför fyrkanten för att imitera instagrams klassiska logotyp. ]]> 2019-01-20 16:30:55 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322505005 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322672032 Min portfolio-sida visar miniatyrer på bilder från mina färdiga dräkter. Beskrivningarna innehåller lite olika information, och genom att klicka på bilden kommer man in på arbetet i detalj.
Vi ser vart på sidan vi befinner oss genom den streckade kvadrat som markerar "portfolio" i meny-raden.]]> 2019-01-21 13:18:54 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322672032 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322672734 Jag beskar bilderna i separata fönster och satte storleken till 200x200px med en upplösning på 240px. Jag grupperade de lager jag jobbade i under övre och nedre rad med projekt, där jag hittade både bilderna samt tillhörande text. Eftersom bilderna redan är redigerade av respektive fotograf jag har arbetat med så har jag inte gjort någon ytterligare redigering på dem.]]> 2019-01-21 13:21:39 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322672734 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322673717 Här ser vi hur sidan ser ut när vi har klickat på någon av miniatyrerna på min portfolio-sida. Här hittar vi lite mer information om hur lång tid dräkten tog, materialkostnad samt lite information om processen. Här kan vi även kika på lite bilder från själva processen samt den referensbild jag arbetade efter. Jag valde att ha bilden på den färdiga dräkten som stor bild, men en funktion jag hade implementerat om det här var en komplett hemsida är möjligheten att klicka på varje liten bild och få upp den större.]]> 2019-01-21 13:26:07 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322673717 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322674556 Min mobilanpassade sida har samma innehåll, men jag har flyttat runt saker lite. Menyraden har flyttat in under en menyknapp, en rund, röd ellips med tre streck på. Jag använder fortfarande en rubrik med en streckad ram runt för att indikera vilken sida vi befinner oss på och behålla användarvänligheten och behålla texten läsbar eftersom en hel menylinje hade krävt att texten blev mycket liten.
Eftersom formatet har ändrats från liggande till stående så har jag flyttat på min profilbild och ändrat den till ett banner-likt element. 
För att min logotyp och min menyknapp inte skall krocka med varandra och göra sidan för rörig har jag flyttat den, tillsammans med mina kontaktuppgifter ned till bottnen av sidan.
Texten har även gått över till att vara centrerad, men innehållet är detsamma. Unicefs banner ligger kvar högst upp.]]> 2019-01-21 13:30:38 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322674556 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322675440 Meny-knappen genererar en pop-ut meny. Jag blev här inspirerad av den meny som klädhemsidan AFound använder, och jag föredrar den över en rullgardin-typ av meny eftersom jag anser att den är lättare att navigera på en liten skärm. Den streckade ramen indikerar fortfarande vilken sida vi befinner oss på.]]> 2019-01-21 13:34:43 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322675440 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322676294 Åter igen har innehållet bytt från ett horisontellt till ett lodrätt format.
"läs mer" har lagts till som en uppmaning för användaren att klicka på varje arbete och se detaljerna.]]> 2019-01-21 13:39:05 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322676294 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322677997 Åter igen samma innehåll som på web-anpassade sidan, endast centrerad eftersom utrymmet på sidan bytt riktning.]]> 2019-01-21 13:45:25 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322677997 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705179 AFounds mobilsida inspirerade min meny-knapp och pop-ut-meny i mobilversionen av min sida.]]> 2019-01-21 15:19:03 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705179 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705437 Inspiration för fördelningen på min sida med meny-bar och placering av logga.]]> 2019-01-21 15:19:56 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705437 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705487 Inspiration för min portfolio-sida med 6 arbeten

]]> 2019-01-21 15:20:04 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705487 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705516 Inspiration för "ett arbete i detalj", på min sida "Boa Hancock"]]> 2019-01-21 15:20:13 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322705516 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322706627 Proportionerna på denna sida är baserade på proportionerna på hur webbläsaren ser ut på min egen datorskärm (30").
Jag har behållt den streckade design som jag tänkte mig på min skiss, som en nick till hur handsydda sömmar ser ut eftersom jag sysslar med att skapa dräkter för hand. Den streckade linjen indikerar vilken sida vi befinner oss på, i detta fall på "om mig". Jag utgår ifrån att inte alla vet vad "cosplay" som är min USP, är, så jag har highlightat ordet i en annan färg för att indikera att det ligger en länk till en artikel som förklarar fenomenet som sådant.
Jag har försökt att göra det enkelt för användare att hitta mina sociala media-kanaler genom att lägga dem som ikoner i min menyrad.

När jag skrev min text försökte jag vara både personlig, men också professionell genom att tala lite om mig själv (min erfarenhet med min konst samt min utbildning) och vad det är jag håller på med. 

Unicefs banner återfinns högst upp på sidan och tanken är att  den sitter statiskt högst upp på hemsidan även när användaren scrollar för maximal exponering för Unicef. 

Jag valde att göra min "profilbild" rund istället för fyrkantig som den var på min skiss då jag tyckte det såg bättre ut tillsammans med den runda formen i min logga.]]> 2019-01-21 15:24:13 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322706627 olivia_ponten https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322712964 2019-01-21 15:46:31 UTC https://padlet.com/olivia_ponten/e9h28selxzjq/wish/322712964