Interaktionsdesign – Sidpuff

En hemsida kan idag bestå av så många små delar, popups, reklambanners osv så man blir helt förvirrad över vart man är. Vi gav studenterna i uppdrag att i en workshop skapa en så kallad sidpuff. En sidpuff som lyfter fram ett element på ett stilfullt sätt och förankrat i bra interaktionsdesign.

Det handlar om att kombinera text och grafik, kanske en bild, så att det ser ut som en del av en webbsida.

Erik Norman gjorde en musikspelare:

Erik norman

Matilda Ericsson gjorde en Receptsida med ”förslag på ytterligare bakverk”.

Bakverk av Matilda och Åsa

 

”Jag tänker mig att min sidpuff är en puff på en sida med matlagning eller bakning. Sidpuffen puffar för “andra bakverk” och den finns alltså på en sida med bakverk, kanske med recept för olika småkakor. Den föreslår andra bakverk, med hjälp av bilder i ett rutnät och beskrivande text under respektive bild. Typografin består av två olika typsnitt, ett för rubriken och ett annat för texten under bilderna. Det i rubriken tillhör typsnittsfamiljen skripter (Bergström, 2012, s.127) och ger sidpuffen ett hemmagjort intryck utan att vara allt för svårläsligt. Texten under bilderna är en sanserif och passar bra i bildtexter (Bergström, 2012, s.126). Under rubriken har jag valt att lägga en linje för att förstärka hierarkin (Cronin, 2009). Den mörka lila färgen som texten har står i bra kontrast mot den ganska ljusa grå nyans som bakgrunden har, detta gör att texten blir lättläslig (Cronin, 2009). Fotografierna finns med för att realisera texten och locka användaren att klicka vidare. ” – Matilda

Mer från Matilda hittar du här.

Vill du se fler sidpuffar så kan du besöka flickr-gruppen.