Når man designer apps eller mere avancerede websites, benytter man ofte et 'rapid prototyping tool' hvor man hurtigt kan lave et layout og implementere den grundlæggende interaktion, sådan at man kan teste om de ideer man har til udførelsen er gode.
Et af de mest populære værktøjer til dette er Figma. Figma er et virkeligt stærkt værktøj med rigtig mange funktionaliteter. I denne øvelse, skal du blot bruge de mest grundlæggende dele til at lave en prototype på en app.
Gå til figma.com og opret en bruger. Det er vigtigt at du opretter dig med en mailadresse du har adgang til. Brug gerne din skole mail - så har du også mulighed for at få den fulde 'educational'/'professional' funktionalitet!
I videoerne herunder giver jeg en kort introduktion til hvordan du kommer i gang med Figma. Når du har set og leget med eksemplerne i videoerne, skal du gå videre og prøve at bygge en prototype på caseopgaven nederst...
Hvis du på din telefon downloader 'figma' appen, og logger ind med samme konto som du har oprettet dig med i figma, kan du bruge telefonen som ekstra skærm der 'live' viser resutaltet af det du laver. Samtidig kan du også teste funktionaliteten direkte på din telefon.
Hvis I er flere der arbejder sammen, kan I lave et team i figma. Når man er en del af samme team kan alle i teamet arbejde samtidigt på produktet (ligesom i google docs ell. lign).
En æggeproducent vil som et led i deres markedsføring gerne lave en lille app der skal gøre det mere interessant at lave mad med æg. Særligt fokuserer de på den yngre målgruppe af 'køkkenbegyndere', men ser også gerne at voksne og ældre uden den store køkkenerfaring vil tage appen til sig. Ud over at hjælpe med at lære målgruppen at koge et æg, skal man også kunne få information om de forskellige typer af æg - såsom øko, fritgående, skrabe og bur æg.
Virksomhedens brand skal fremgå diskret i appen.
Ægge-lommeregner: Brugeren indtaster æggets størrelse (lille, medium, stort), starttemperatur (direkte fra køleskabet eller stuetemperatur) og det ønskede resultat (blødkogt, smilende, hårdkogt).
Timer-funktion: Appen indstiller en præcis timer baseret på lommeregnerens input.
Notifikationer: Brugeren får besked, når timeren er færdig, og ægget er klar.
Visuel guide: En animation eller billedserie viser de forskellige stadier af kogningen.
Læring
Appen guider brugeren med simple, trinvise instruktioner. Den bruger visuelle elementer til at illustrere hvert trin, såsom æggets tilstand, fra start til slut.
Indtastning
Brugeren mødes af en klar og intuitiv grænseflade, hvor de nemt kan indtaste æggets størrelse, temperatur og den ønskede hårdhed. Designet prioriterer enkelthed for at undgå forvirring.
Tidsstyring
Efter indtastningen visualiserer appen den resterende tid med en nedtælling og en simpel animation. Forskellige farver og ikoner indikerer, når ægget er blødkogt, smilende eller hårdkogt.
Feedback og bekræftelse
Appen giver klar feedback. En notifikation og lyd indikerer, når ægget er færdigt. En simpel besked som "Dit perfekte æg er klar!" bekræfter succesen.
Overblik og genbrug
Brugeren kan let se de indtastede oplysninger og gemme deres foretrukne indstillinger. Appens design opmuntrer til gentagen brug.