Skrevet af den

Baser din iPhone applikation på design patterns

Som fortsættelse på sidste uges introduktion til design patterns kan du i denne uge læse videre om fordelene ved at basere dit iOS-design på design patterns samt se et eksempler på et par velkendte iOS design patterns – Multi State Button og Springboard.

Hvorfor tænke design patterns ind i designet af din iPhone app?

Foruden de fordele, som jeg i min første blogpost om design patterns beskrev, så kan et gennemtænkt koncept fra start af have positiv indflydelse på såvel budgettet som den endelige brugsoplevelse:

  • Tænk færdigt – og kom godt fra start. Valget af design patterns har stor indflydelse på den kode, der skal skrives. Den tid det tager, at Design Patternsgennemtænke og skitsere hele konceptet, vil efterfølgende være godt givet ud. Undersøg hvilke design patterns andre applikationer benytter til at løse lignende udfordringer og tegn så dine wireframes. Der bliver flere end du tror.
  • Skab en intuitiv applikation. Der findes næppe noget mere strømlinet produkt end en iPhone. Samtlige indbyggede applikationer benytter en række grundlæggende design patterns, som tusindvis af applikationer i App Store også benytter. Dermed bliver det nemt for brugeren at afkode, hvilke interaktionsmuligheder der er.
  • Spar udviklingstimer. Udviklingsværktøjet XCode (ja, der er selvfølgelig kun ét) giver dig en række standard design patterns, som du med relativt lidt udvikling kan gøre brug af og dermed spare massive mænger af udviklingstimer. Tre eksempler på dette er Navigation Controller, Split View Controller og Table View Controller. Sidstnævnte benyttes til listevisning, som du f.eks. kender fra dit mail-program, hvor du bl.a. får et udtræk af dine mails ligesom du kan scrolle, slette og klikke på hvert element i listen.

Husk at de valgte design patterns kun behøver at udgøre skelettet af applikationen. Man kan sagtens designe og modificere design patterns til eget formål, hvilket nedenstående eksempler fint viser.

Eksempel 1: Multi State Button Pattern

Normalt siger man, at interface elementer kun skal have et enkelt formål. Dette princip brydes dog af Multi-State Button, som især er at finde i iOS-applikationer.

Multi State Button

Eksempel på Multi State Button pattern i vore egen applikation, Pakkeliste

Multi State Pattern i App Store

Eksempel på Multi State Button pattern i App Store

Benyttes Multi State Button pattern rigtigt, er det smart, effektivt og pladsbesparende. Vær opmærksom på, at knappens forskellige tilstande (og eventuel ordlyd) skal være logisk i forhold til handlingen og til hinanden.

Eksempel 2: Springboard Pattern

Springboard (eller Launchpad) design pattern der har eksisteret længe, men bliver i dag benyttet af mange iPhone applikationer som alternativ til en listevisning med muligheder. Et springboard pattern kombineret med ikoner giver et godt overblik, og kan af brugeren nemt afkodes som en form for skrivebord i applikationen.

Eksempel på Springboard pattern

Eksempler på Springboard pattern.

LinkedIn applikationen kombinerer det benyttede Springboard pattern med et metafor pattern, som sætter mulighederne i kontekst og som tydeliggør, hvor man i applikationen befinder sig.

I næste uge kan du læse en anmeldelse af bogen Mobile Design Pattern Gallery af Theresa Neil, som foruden Multi State Button og Springboard, giver eksempler på omkring 100 forskellige design patterns.