A quick & brief overview of the Digital Design Landscape (Summer 2014) in an easy to digest deck.

1. DIGITAL DESIGN TRENDS
SUMMER / 2014

2. FLAT / MINIMAL
“a two dimensional design for a two
dimensional screen.”
Sabina Idler - Usabilla

3. FAST, HONEST, TRENDY, SCALABLE,
RESPONSIVE MOBILE, USER FOCUSED
flatvsrealism.com AdrianHoppel.com blog.usabilla.com

4. THEN
Apple
Microsoft
Google
NIKE
World Times
ebay
Weather APP
Icons

5. Apple
Microsoft
Google
Twitter / Facebook / Spotify
NIKE
NOW
Flat Guitars Dots
B&O

6. WIDER IMPACT

7. SPOT THE DIFFERENCE

8. SPOT THE DIFFERENCE
Right a bit
Down a bit

9. “LESS IS MORE”, “LESS BUT BETTER”,
“DOING MORE WITH LESS”
Ludwig Mies van der Rohe Dieter Rams Buckminster Fuller

10. A NOD BACKWARDS?
In some respects, flat graphics can be seen as a nod back to early print, specifically Russian propaganda war
posters. At the time, before computers — yes, there was such an era — designers were forced to create flat
images because of printing constraints. Now it seems to be happening again, but with screens.
Steven Heller, co-chairman of the M.F.A. Design Department at the New York School of Visual Arts

11. TREND OR REVOLUTION?
Many have accredited the rise of Minimalism in Design in the 1920’s & 30’s as a reaction to amongst other things
Abstract Expressionism, the same could be said today of Flat Design as a reaction to the Skeuomorphism.
In real terms, what we’re seeing commercially is a move towards a hybrid model, where texture exists but is
used sparingly and often only if it’s purpose can be validated, such as a identifying a CTA / Button.

12. TREND OR REVOLUTION?
The next Mobile OS from Apple, iOS8 seems to be treading this hybrid path.

13. 2013 - Lorenzo Verzini - http://lorenzoverzini.com/

14. OTHERS

15. HTML5

16. HTML5 ROCKS
“HTML5 is a markup language used for structuring
and presenting content for the World Wide Web
and a core technology of the Internet”

17. HTML5 ROCKS
“HTML5 gets bounded about as this “thing” but in
reality it’s just a small part of a wider framework
and feature set.

18. FEATURES SUCH AS

19. VIDEO
studiobreeder.com volkswagen-sportscars.fr/cars/

20. 24hoursofhappy.com
VIDEO

21. AUDIO (& Speech)
jamwithchrome.com peanutgalleryfilms.com

22. TOUCH
www.signedon.com/adding-ios-touch-events-to-farbtastic-color-picker
OnSwipe
Microsoft IE 10

23. ANIMATION & 3D (WEB GL)
bravestman.com workshop.chromeexperiments.com/machines/

24. BIG IMAGERY & VIDEO

25. BRITISH AIRWAYS

26. BMW MAGAZINE - bmwmagazine.com

27. GMC : THE ALL-NEW SIERRA

28. mobee.tm.mc

29. OBJECTS (STILL LIFE)

30. PEOPLE / PORTRAITURE

31. BOLD TYPOGRAPHY

32. @FONT-FACE RULES THE WEB

33. AND MONOCHROME BACKGROUNDS

34. DETAILS

35. SUBTLE TRANSITIONS & EFFECTS (MICRO UX)
mailchimp.com/comic/
codepen.io/sol0mka/full/Jsyxq
tympanus.net/codrops/
hugeinc.com/ideas/perspective/micro-ux

36. http://roundicons.com/

37. TILES

40. CONTENT FIRST

41. Mobile and responsive are creating a new interaction design
landscape that puts users and content first.
If we don’t design with content first, our users will do it for us.
Jeffrey Zeldman

42. Enjoy WishList.com
Mundita
The New Yorker

43. THANKS
QUESTIONS?