frukostseminarium 2011 - storleken har betydelse

STORLEKEN HAR BETYDELSEEn vandring i det digitala museet

Av Fredrik Marcus 8-)

Fredrik Marcus aka FM1963-PresentCD/AD/2D/3D/HD inte VD

fm@creuna.comtwitter.com/fmfredrik.marcus@facebook.com

Fuck ArtLet´s Dance

AVDELNINGEN FÖR MULTIMEDIA

Multimedia MacZoo

Fredrik Marcus/Lars Blåsjö (1963-)

MarcusProdukter 1992

AVDELNINGEN TIDIG INTERNET

Blandad tidig web

Fredrik Marcus (1963-)

Arla/Astra/ASG

Ikoner för System 1

Susan Kare 1954-

Apple Inc 1984 to Present

AVDELNINGEN FÖR TIDIGA IKONER

Mobilt

Cell Phone Camera History

http://ca-me-ra.com/

Russina Doll Cellphone

Telefonsamtalet är på utdöende 8-)

From ape to I-man

Jesper Waldersten 1969-

waldersten365.com/

A smartphone retrospective _

A SmartPhone Retrospective

Marco Arment

Marco.Org 2010

Smartphone platform growth

45%

3%17%

21%

8%

5%1 %

Symbian Android iOS RIM Windows Mobile Linux Others

37%

25%

17%

15%

3%2%2 %

2009 2010Smartphone platform growth

Horace Dediu

http://www.asymco.com/

iPhone

iPhone 4 (2010)

Apple Design Team

Apple Inc 2010 to Present

Enkel grafikhantering. Två olika storlekar på skärmar

Nya upplösningen på iPhone 4 är en revolution

Allt grafik är PNG

Appstore är en enkel och bra distributionskanal För att hitta och uppdatera 8-)

Börjar kännas lite omodern i gränsnittet

Helvetica Neue som typsnitt

Respektera operativet

Kolla din design hela tiden på telefonen

Se till att alla i teamet använder telefonen i fråga

Erfarenheter iPhone

Ipad 1024 by 768 pixels upplösning med 132 pixels per inch (ppi)

iPhone 3GS 480x320 pixels upplösning med163 ppi

iPhone 4 med 960 by 640 pixels upplösning med 326 ppi

Upplösningar iOS

Android

Android OS (2003)

Google Design Team

Google Inc 2005 to Present

Erfarenheter AndroidAnnan grafikhantering än iPhone. Anpassar för Low Medium och High DPI. Påminner om webb.

Fragmenterad plattform när det gäller OS-version och antal devicer och prestanda

Skönt att slippa Apples App store 8-)

Droid Sans som typsnitt

Respektera operativet och porta INTE iPhonedesign

Kolla din design hela tiden på telefonen

Kolla inte bara i emulator utan i devicen i fråga

Se till att alla i teamet använder telefonen i fråga

Fragmentering Android

WP7

Windows Phone 7 OS (2010)

Microsoft Design Team

Microsoft Inc 2010 to Present

Erfarenheter WP7Helt annan ballpark än dom andra OSen

Fokuserar på att få saker gjorda

Känns fortfarande väldigt tidigt. Lite svårt att ersätta med.

Segoe WP som typsnitt

Alla telefoner har nu 800 x 480 pixlars format

Befriande med annat gränsnitt. Content NOT Chrome

Läs in dig noga innan du sätter igång

Typografi och rörelse är viktigare på denna än andra OS

Userinterfacet kallas Metro

Se till att alla i teamet använder telefonen i fråga

Panorama WP7

UI Design and Interaction Guide WP7

1) Clean, light, open, and fast: It is visually distinctive, contains ample white space, reduces clutter and elevates typography as a key design element.

2) Content, not chrome: It accentuates focus on the content that the user cares most about, making the product simple and approachable for everyone.

3) Integrated hardware and software: Hardware and software blend into each other and create a seamless user experience from single-button access to Search, Start, Back and the camera to on-board sensor integration.

4) World-class motion: The Windows Phone 7 touch and gesture experiences on capacitive screens are consistent with Windows 7 on the desktop and include hardware-accelerated animations and transitions to enhance the user’s experience at every turn.

5) Soulful and alive: A personalized, automatically updated view into the information that matters most to the user is enabled and brings to life a cinematic photo and video experience by having a fully integrated Zune media player experience.

Panorama WP7Segoe WP RegularAbcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ

Segoe WP BoldAbcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ

Segoe WP LightAbcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ

Segoe WP Semi-BoldAbcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ

Segoe WP Semi-LightAbcdefghijklmnopqrstuvwxyz1234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ

Segoe WP BlackAbcdefghiіjјklmnopqrstuvwxyz12345678ABCDEFGHIІJЈKLMNOPQRSTUVWXYZ

Övriga

Mobil WebVi brukar bygga för iOS och Android och resten blir mobil webb

Funkar på alla övriga devicer

Capability detection

Utvecklingskostnader mot att utveckla OS-specifika appar

Mobil web lämpar sig inte så bra på grafikintensiva saker

Hur många olika operativsystem klar man av som kund

Operativsystem att kolla: Palm/HP webOS

Och Microsoft vad gör dom

iPadiPad 2 (2011)

Apple Design Team

Apple Inc 2011

Apples ipad revolutionDen genomsnittlige analytikerns prognos 2010: 3,3 miljoner

Antalet sålda ipads under 2010: 14,8 miljoner

Analytikernas gissningar för iPad 2 2011: 30-55 miljoner

Erfarenheter iPadTänk om kring interaktionsdesign och design! Det som fungerar på iPhone fungerar inte automatiskt på iPad!

Skärmen är mycket större fysiskt

Det virtuella tangentbordet är större

Både iPhone och iPad kan hantera multi-touch, men det är egentligen bara på iPad det går att använda två händer.

Lägg in skisserna I keynote för att simulera rörelse och för att visa kunden olika sidor. Du får också en bättre förståelse

Bättre prestanda mot iPhone men mindre internminne (obs gäller endast endast original iPad)

Erfarenheter iPadDen stora ytan gör att man kan och vill se fler saker samtidigt.

The iPad is a post PC Device. “PCs are going to be like trucks. Less people will need them… This transformation is going to make some people uneasy. The PC has taken us a long way.

Designing for iPad: Reality Check

2010 by Oliver Reichenstein.

informationarchitects.jp

Desktop

Erfarenheter DesktopVarför inte mer Fluid = Utnyttja ytan mer

Hemmet har inte plats för två STORA skärmar

Vanliga människor klarar sig på mobil/platta

Just nu sker innovationen på mobilsidan/tablet

Nästa krig utkämpas om TV-skärmen

10 miljarder

Apps are being webified. The web is being appified.

The future is bright for developers.

Flipboard CoFounder

En förflyttning sker NU

Touch

TOUCH slår igenom heltOch all web ska touchanpassas från och med NU

Små till större touchskärmar

Gestures

Vi kommer att lära oss mer gestures

Gestures

07:00Frukost 08:30 Går till jobbet

09:00Jobbar 12:00 Lunch 13:00 Jobbar

22:00 Hemma

Olika Skärmar olika tider på dagen

Designa för kontextenOdenplans Tunnelbanestation

Stockholms Stad (1950-)

Copyright Clear Channel

Designa för kontextenUP Series (1969

Gaetano Pesce (1939-)

B&B Italia 1969 to Present

Crapple

Tim Lahan

Poolga

Mer intim att använda

TrenderHögupplöst både på telefoner och snart på desktop och displayer

Typografin kommer med upplösningen

Cleant och platt som motreaktion

Fejkade metaforer ska bort

Texturer, mönster, detaljer, rörelser

Rörelse för att lättare förstå vad som händer, inte som kul effekt.

Lila elefant

Snodd ur reklam

Wired Magazine 2011

Man vill göra allt överallt. Inte bara på stan utan också hemma (i soffan i sängen)

Fundera vad ni vill göra innan ni går in i att utveckla för många plattformar

Genomdesignade enkla fokuserade tjänster regerar (även på web)

Det är lättare än någonsin att påverka ett varumärke genom att differentiera och ha bättre tjänster än sina konkurrenter (tyvärr också genom att ha dåliga)

Key Takeaways

Japansk IkonKille

Eboy

http://hello.eboy.com/eboy/

Fredrik Marcus aka FM1963-PresentCD/AD/2D/3D/HD inte VD

fm@creuna.comtwitter.com/fmfredrik.marcus@facebook.com

The End