View
676
Download
0
Category
Preview:
DESCRIPTION
Titta på både ett underhållande och tankeväckande frukostseminarium om webb och storlek. Seminariet handlar om att jobba med olika storlekar på skärmar, men också om att filstorleken har blivit viktigt igen i en tid när allt fler når internet genom trådlösa inte alltid snabba uppkopplingar. STORA och små idéer från internets och Creunas eget svar på Willy Wonka. Fredric Marcus, Creative Director
Citation preview
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
Recommended