Starbucks

Redesign

Starbucks Corporation is een wereldwijde keten van koffiehuizen afkomstig uit de Verenigde Staten, opgericht in 1971 in Seattle. De keten heeft internationale bekendheid en vestigingen over de hele wereld. Tijdens een bezoek aan Amsterdam ontstond bij mij het idee om hun website te bekijken. Na dit te hebben gedaan, kwam ik tot de conclusie dat de site eigenlijk niet zo bijzonder is. Starbucks heeft een opvallend logo en een herkenbare huisstijl, die naar mijn mening beter benut kunnen worden dan momenteel het geval is op hun website. Op de homepage van Starbucks Nederland zijn voornamelijk nieuwsberichten te vinden, terwijl Starbucks juist zou moeten draaien om hun heerlijke dranken.

Met deze inzichten besloot ik dat de website van Starbucks Nederland een redesign kon gebruiken. Dit is dus niet uit opdracht gemaakt. Uit eigen initiatief ben ik vervolgens gestart met het creëren van een volledig nieuw design voor de homepage, waarbij ik gebruikmaakte van geanimeerde elementen om de pagina extra dynamiek te geven.

UI design Prototype Animaties

Voordat ik aan het redesign van de Starbucks homepage kon beginnen, moest ik de kleuren en het lettertype kiezen. Aangezien Starbucks een sterke huisstijl heeft, besloot ik deze te handhaven. Gezien de huidige samenstelling van de homepage, voornamelijk bestaande uit nieuwsberichten, was het tevens noodzakelijk om te bepalen welke elementen een plek op de nieuwe homepage zouden krijgen.

Hoewel nieuwsberichten belangrijk zijn, met name voor een grote keten, zijn de koffies en andere dranken van Starbucks het voornaamste focuspunt om over te brengen. Om dit helder over te brengen en een duidelijk verhaal aan de bezoeker te vertellen, koos ik voor geanimeerde elementen te gaan gebruiken die de bezoeker door de website zouden leiden.

Het iteratieproces kon beginnen, en na vele ontwerpen die in eerste instantie niet aan mijn verwachtingen voldeden, begon ik langzaam tot het gewenste eindresultaat te komen. Daarnaast heb ik subtiele details toegevoegd, zoals het logo op de achtergrond en de druppels van de slagroom. Door gebruik te maken van ronde vormen en losstaande componenten verdeeld over de pagina kreeg het design meer levendigheid en een zachtere uitstraling.
‍
Nadat het design voor de homepage na verschillende versies compleet was, ben ik overgegaan tot het animeren ervan. In Figma heb ik geanimeerde prototypes gemaakt om de overdracht naar ontwikkelaars of stakeholders zo helder mogelijk te maken. Dit diende als een test om mijn kennis van Figma, met name op het gebied van animatie, te evalueren. Ook hier heb ik verschillende iteraties doorlopen voordat ik tot een definitieve versie kwam.