Hvordan lage apper

Hvordan lage apperThomas SkavhellenSixty.no

Apper fra A-Å• Hvem er Sixty

• Hva er en App

• Hvilke enheter skal man støtte

• Native eller Web app

• Prosessen bak en app

• De gode app ideene

Forretningsområder• Design og utvikling for digitale medier

• Webutvikling & Webdesign

• Publiseringsløsninger (Silverstripe)

• Interaktiv design for TV

• Apps (iPhone, Android og nettbrett)

• 3D og animasjon

Det handler om å væretilstede på alle flatene

Kjent forTV Design

Den Gyldne HaneBeste Applikasjon

Rallarvegen

Hva er en app?

Programvare som må være skrevet i det språket til den spesifikke plattformen den skal brukes på.

Mobil Apps

Hvilke plattform skal appen din støtte?

Netcom salgstall, April 20131. Apple iPhone 5, iOS2. Samsung Galaxy S III, Android3. Apple iPhone 4, iOS4. Apple iPhone 4S, iOS5. Sony Xperia Z, Android6. Samsung Galaxy S III Mini, Android7. Samsung Galaxy S3 LTE, Android8. Samsung Galaxy Note II, Android9. Samsung Galaxy S4, Android10. Sony Experia V, Android

labs.finn.no

labs.finn.no

Oppsummering• iOS og Android er de to største plattformene

• I utlandet er Android størst (Flest brukere)

• Her hjemme er iOS størst (en stund til)

Native app eller Web App(eller begge?)

Ulike måter å utvikle på• Native apps- Skriver appen i språket spesifikt for enheten den skal brukes på. (iOS, Android,

Windows)

• Web apps- Skriver appen i webspråket tilpasset mobil (HTML, CSS, Javascript) kan bruke et

rammeverk for å pakke den inn som en native app. (http://www.appshed.com)

• Hybryd apps- Skriver appen native men kan inneholde innhold fra web.

Native vs Webapp• Raskere apps, laster innhold internt

og ikke fra web

• Tilgang til alle telefonfunksjoner som kamera, kompass osv.

• Føles som en app og ikke en webside

• For krevende applikasjoner, der look and feel er viktigst.

• Lettere å komme i gang.

• Støtter alle telefoner med en kode

• Trenger mange plugins for å få til SMS, Push meldinger, print, in-app kjøp. Gjør appen tregere.

• For enkle applikasjoner som ikke krever så mye av telefonen.

Prosessen bak en app

Slik jobber vi

Workshop Muligheter/prioriteringer Tilbud

Design Utvikling Testing Revidering Lansering

Intromøte

Wireframe

Prototype

Wireframes • Wireframes er ikke endelig design, kun skisser /

plantegning.

• Tegn appen på papir eller pc/mac før du begynner å designe.

• Finn ut hvor mange skjermbilder du skal lage.

• Har du alle knapper du trenger?

• Peker alle knapper til en side eller funksjon?

• Få med alle dialogbokser (Ja/Nei bokser)

Prototype• Test ut alle wireframes uten å programmere

• Kan teste wireframes eller mer ferdig design

• Du får en «ferdig» app og kan klikke deg rundt i appen med telefonen din.

• Sjekker om du har fått med deg alt eller om appen fungerer slik du har tenkt uten å programmere.

RessurserWireframe software

• http://www.justinmind.com

Prototype software

• https://popapp.in

Design• iOS og Android oppfører seg på forskjellige måter, må

derfor designes på forskjellige måter.

• Android telefoner har noen knapper (tilbake knapp) iOS har ingen.

• iPhone har 2 forskjellige skjermstørrelser å forholde seg til. iPhone 4 og iPhone 5. Android har veldig mange.

• Se på populære apper, hvordan ser de ut, stjel og lær.

RessurseriOS Patterns

• http://pttrns.com

iOS Skjermstørrelser

• http://ivomynttinen.com/blog/the-ios-design-cheat-sheet-volume-2/

Android Patterns

• http://www.android-app-patterns.com

iOS Skjermstørrelser

• http://developer.android.com/guide/practices/screens_support.html

Tenk gjennom dette..• Hvem skal bruke appen? (Målgruppen)

• Hva skal appen gjøre? (Løser den et problem)

• Er appen morsom? (Morsomme apper blir delt)

• Er appen din bedre enn konkurrentene?

• Er det mye interaktivitet i appen? (Brukes den ofte?)

• Har du et bra forklarende ikon?

Før du utvikler• Lag en markedsplan, hvordan skal appen tjene penger?

• Sett opp en appkonto (Google Play og/eller AppStore)

• Tegn applikasjonen på papir (Prototype)

• Hvem gjør hva? (Design, Utvikling, Markedsføring)

• Du er klar for å utvikle

• Sett i gang markedsføringsplanen

• Lanser!

Eksempler på en dårlig app ide.

Eksempler pågode app ide.

Takk