Top Banner
the 2012 trends in interactive design ID12
103

Prophets trends in Interactive Design 2012

Aug 17, 2014

Download

Design

Prophets Agency

Prophets presents the 2012 trends in interactive design on http://www.prophets.be/DesignTrends

Our vision of where interactive design is going in the near future and how to respond to it. An inspiring presentation filled with real life examples of top-advertisers with a vision.

More info on www.prophets.be/DesignTrends
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Prophets trends in Interactive Design 2012

the 2012 trends

in interactive design

ID12

Page 2: Prophets trends in Interactive Design 2012

hi, my name is Petra Sell

german designer living in Belgiumdesign director @prophetsagencyfollow me on twitter or behanceget more details on linkedin

about me

Page 4: Prophets trends in Interactive Design 2012

2012 design trends

emerging trends in 2011

Page 5: Prophets trends in Interactive Design 2012

1emerging trends in 2011

multiple device thinking

Page 6: Prophets trends in Interactive Design 2012

responsive design1

foodsense.is

Page 7: Prophets trends in Interactive Design 2012

responsive design1

www.flowfestival.com

Page 8: Prophets trends in Interactive Design 2012

2emerging trends in 2011

flash steps aside

Page 9: Prophets trends in Interactive Design 2012

campaign sites fully animated in css2

www.onehourpersecond.com

Page 10: Prophets trends in Interactive Design 2012

“ “we will no longer continue to develop Flash Player in the browser to work with new mobile device configurations (…) for Android and BlackBerry PlayBook.

ADOBE press release

Page 11: Prophets trends in Interactive Design 2012

3emerging trends in 2011

this is not an arial

Page 12: Prophets trends in Interactive Design 2012

mad about webfonts3

www.kitchensinkstudios.com

Page 13: Prophets trends in Interactive Design 2012

show off with typo text3

dentsunetwork.com

Page 14: Prophets trends in Interactive Design 2012

4emerging trends in 2011

parallaxed

Page 15: Prophets trends in Interactive Design 2012

parallax goes mainstream4

www.editsquarterly.com

Page 16: Prophets trends in Interactive Design 2012

no words – just scroll4

www.janploch.de

Page 17: Prophets trends in Interactive Design 2012

html5 comic4

www.soul-reaper.com

Page 18: Prophets trends in Interactive Design 2012

5emerging trends in 2011

infographics

Page 19: Prophets trends in Interactive Design 2012

animated infographics are the new infographics5

www.good.is/100

Page 20: Prophets trends in Interactive Design 2012

survey goes visual5

slaveryfootprint.org

Page 21: Prophets trends in Interactive Design 2012

6emerging trends in 2011

onepager deluxe

Page 22: Prophets trends in Interactive Design 2012

scroll and discover6

www.nest.com/living-with-nest

Page 23: Prophets trends in Interactive Design 2012

expandable content6

www.neotokio.it

Page 24: Prophets trends in Interactive Design 2012

one page lover gallery6

onepagelove.com

Page 25: Prophets trends in Interactive Design 2012

2012 design trends

way to go in 2012

Page 26: Prophets trends in Interactive Design 2012

1 way to go in 2012

content is king, users are queens

Page 27: Prophets trends in Interactive Design 2012

“ “Designers are no longer designing for the device, they are designing for the experience.

COURTNEY BOYD MYERS, Features Editor of the next web

Page 29: Prophets trends in Interactive Design 2012

instapaper: read later (+ remove the clutter) 1

Page 30: Prophets trends in Interactive Design 2012

couch mode1

vimeo.com/36140636

Page 31: Prophets trends in Interactive Design 2012

couch mode 2 (live tour through a museum)1

livetour.mas.be

Page 32: Prophets trends in Interactive Design 2012

2way to go in 2012

less is more

Page 33: Prophets trends in Interactive Design 2012

only the essence2

path.com

Page 34: Prophets trends in Interactive Design 2012

hugh emotional headers (and arrow links to content)2

www.hanzell.com/winemaking.html

Page 35: Prophets trends in Interactive Design 2012

3way to go in 2012

apps redefining the web

Page 36: Prophets trends in Interactive Design 2012

apps inspire the web3

www.icloud.com

Page 37: Prophets trends in Interactive Design 2012

4way to go in 2012

useful, custom and pretty

Page 38: Prophets trends in Interactive Design 2012

registration as convenient as possible 4

littlebigdetails.com/post/14671757055/path-when-signing-up-as-a-new-member-the-iphone

Page 39: Prophets trends in Interactive Design 2012

form informs function4

Page 40: Prophets trends in Interactive Design 2012

make online reading more convenient4

www.smashingmagazine.com/2011/10/07/16-pixels-body-copy-anything-less-costly-mistake

Page 41: Prophets trends in Interactive Design 2012

not just good-looking4

contrastrebellion.com

Page 42: Prophets trends in Interactive Design 2012

“ “With more companies and startups placing high importance on design and usability the web will only continue to get better and more user-friendly.

RYAN ESSMAkER, design entrepreneur

Page 43: Prophets trends in Interactive Design 2012

design sells more than ever4

fab.com

Page 44: Prophets trends in Interactive Design 2012

upgrade your body as design object4

tattly.com

Page 45: Prophets trends in Interactive Design 2012

prettify administration3

www.thrivesolo.com

Page 46: Prophets trends in Interactive Design 2012

5way to go in 2012

even google realizes that

Page 48: Prophets trends in Interactive Design 2012

“ “you can’t just be geeky anymore, you have to be beautiful too.

BRAD MCCARTY, Managing Editor the next web

Page 49: Prophets trends in Interactive Design 2012

google zeitgeist5

www.googlezeitgeist.com/en/top-searches/adele

Page 50: Prophets trends in Interactive Design 2012

mail.google.com/mail/?shva=1#compose

UI experience x 20005

Page 51: Prophets trends in Interactive Design 2012

6way to go in 2012

bookmarkinggets visual

Page 52: Prophets trends in Interactive Design 2012

is ‘pin it’ the new ‘like it’?6

pinterest.com

Page 53: Prophets trends in Interactive Design 2012

inspiration library6

gimmebar.com

Page 54: Prophets trends in Interactive Design 2012

2012 design trends

technologicalprogress

Page 55: Prophets trends in Interactive Design 2012

1technological progress

animate

Page 56: Prophets trends in Interactive Design 2012

funky css3 shapes and animations1

beta.rallyinteractive.com

Page 57: Prophets trends in Interactive Design 2012

css animation1

nizoapp.com

Page 58: Prophets trends in Interactive Design 2012

scroll innovation1

www.360langstrasse.sf.tv/page

Page 59: Prophets trends in Interactive Design 2012

parallax pearle1

lamoulade.com/#!/services

Page 60: Prophets trends in Interactive Design 2012

no flash - all html1

discover.store.sony.com/tablet/

Page 61: Prophets trends in Interactive Design 2012

2technological progress

flash is the new niche

Page 62: Prophets trends in Interactive Design 2012

and sometimes flash is just right2

solutionsthatmatter.van.fedex.com/full.php#/healthcare/

Page 63: Prophets trends in Interactive Design 2012

webcam integration & video 2

experience.mtvnhd.com

Page 64: Prophets trends in Interactive Design 2012

3technological progress

challenge the site flow

Page 65: Prophets trends in Interactive Design 2012

innovative navigation3

www.nikesnowboarding.com/products

Page 66: Prophets trends in Interactive Design 2012

functional navigation3

www.crateandbarrel.com/dining-and-entertaining/individual-bowls/gemma-wave-bowl/s544135

Page 67: Prophets trends in Interactive Design 2012

4technological progress

custom fonts are mainstream

Page 68: Prophets trends in Interactive Design 2012

minimalism: typo meets color meets animation4

mahifx.com

Page 69: Prophets trends in Interactive Design 2012

webfont is approaching the finesse of a printfont4

ie.microsoft.com/testdrive/Graphics/opentype/opentype-fontbureau/index.html#small-caps

Page 70: Prophets trends in Interactive Design 2012

5technological progress

web GL

Page 71: Prophets trends in Interactive Design 2012

web GL experiments5

www.ro.me/film

Page 72: Prophets trends in Interactive Design 2012

web GL commercial use5

www.adidas.com/football/uk/pages/f50

Page 73: Prophets trends in Interactive Design 2012

6technological progress

APImash ups

Page 74: Prophets trends in Interactive Design 2012

instagram, my favourite app6

ink361.com/#/popular

Page 75: Prophets trends in Interactive Design 2012

daily dosis best of social goes offline6

bergcloud.com/littleprinter/#!prettyPhoto

Page 76: Prophets trends in Interactive Design 2012

7technological progress

responsive web design 2.0

Page 77: Prophets trends in Interactive Design 2012

mastering responsive design7

www.bostonglobe.com

Page 78: Prophets trends in Interactive Design 2012

“ “Simply using responsive design to make full site accessible on mobile devices results in substandard UX.

JAkOB NIELSEN, UI expert

Page 79: Prophets trends in Interactive Design 2012

“ “associate devices with purpose: I want to check (mobile), I want to manage (desktop), I want to immerse (tablet).

WhITNEY hESS, UX Designer

Page 80: Prophets trends in Interactive Design 2012

RESS: Responsive Design + Server Side Components7

Page 81: Prophets trends in Interactive Design 2012

2012 design trends

so what you reallyneed to do

Page 82: Prophets trends in Interactive Design 2012

1what you really need to do

Acknowledge and embrace

unpredictability

Page 83: Prophets trends in Interactive Design 2012

trial & error1

wave.google.com

Page 84: Prophets trends in Interactive Design 2012

beta testing (the geeks in us love it)2

betali.st

Page 85: Prophets trends in Interactive Design 2012

fund design projects1

www.kickstarter.com

Page 86: Prophets trends in Interactive Design 2012

2what you really need to do

processmix

Page 87: Prophets trends in Interactive Design 2012

boooring

yessssss!

rethink the workflow2

Page 88: Prophets trends in Interactive Design 2012

“ “This past year, I’ve led more working sessions, had more discussions, simplified more wire-frames, edited more collaborative Google docs, responded to more Basecamp posts, written more stories, and spent less time in Photoshop and Illustrator than I ever have before. I’m a better designer for it.

DAN MALL, DD Big Spaceship

Page 89: Prophets trends in Interactive Design 2012

beta multitask2

www.wunderkit.com

Page 90: Prophets trends in Interactive Design 2012

3what you really need to do

Use your instinct

Page 91: Prophets trends in Interactive Design 2012

“ “Emotion is at the heart of every decision we make. … We do what feels right, we go with our gut.

AARON WALTER, lead designer Mail Chimp

Page 92: Prophets trends in Interactive Design 2012

capture the soul of the product3

www.heringberlin.com

Page 94: Prophets trends in Interactive Design 2012

“ “users tell us so much about themselves through their repeated use of our product and we haven’t done enough work to create customized content experiences for them as a result of all of that intel.

WhITNEY hESS, UX Designer

Page 95: Prophets trends in Interactive Design 2012

customized information3

www.facebook.com/about/timeline

Page 96: Prophets trends in Interactive Design 2012

felton talks about FB timeline3

www.fastcodesign.com/1665414/designers-behind-facebook-timeline-5-lessons-for-creating-a-ui-with-soul

Page 97: Prophets trends in Interactive Design 2012

“ “This year designers have a chance to actively nudge the world in any direction they like.

CAMERON kOCzON, gimmebar

Page 98: Prophets trends in Interactive Design 2012

a must-read3

www.alistapart.com/articles/an-important-time-for-design

Page 99: Prophets trends in Interactive Design 2012

“ “keep looking, don’t settle.STEVE JOBS

Page 100: Prophets trends in Interactive Design 2012

2012 design trends

the future is beautiful

Page 101: Prophets trends in Interactive Design 2012

enjoy!1

designers.mx/#/mixes/listen/enjoy-the-crisis

Page 103: Prophets trends in Interactive Design 2012

nice to meet you!

Petra Selldesign director at prophets.be

@volpelino