AWWWARDS' Web and-mobile-trends-2013


Published on

The Awwwards community are a
faithful audience, always interested
in learning and dedicating their
time to acquiring the necessary
technical knowledge to apply in
their daily work. With the noble
aim of being a useful tool for our
community, at the end of 2012 we
decided to gather the opinions
of renowned experts on how the
web industry will evolve in the
complex times we live in, in this
tower of Babel of technologies and
devices that’s rushing towards us

1 Comment
  • I think this will open new scece for my thought for near future work.
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

AWWWARDS' Web and-mobile-trends-2013

  1. 1. Web Design Trends 2013 1
  2. 2. TRE NDS Project EDITOR IN CHIEF and ART DIREC- TION: Awwwards Team. 2013 Awwwards BlogWeb Design Trends 2013 2
  3. 3. Index/ IndexIndex 3 Rachel Andrew 78Preface 4 Simon Foster 32Interviews 7 Trent Walton 51Aarron Walter 48 Ultranoir 60Ben Cline 45 Unit9 86Brad Frost 68 Veerle Peters 26B-Reel 89 Conclusions 105Bruce Lawson 36 Data 113Dan Mall 8 Acknowledgments 116Dave Rupert 23 Credits 118Davin Wilfrid 102Denise Jacobs 29Epic Agency 81F-i London 92Hello Monday 95Hinderling Volkart 72Ian Hickson 64Jeffrey Zeldman 75Jenn Lukas 14Karen McGrane 11Legwork 57Luciano Foglia 42Mike Kus 16Nick Pettit 19Oliver Reichenstein 53 Web Design Trends 2013 3
  4. 4. Preface Chapter. 1Web Design Trends 2013 4
  5. 5. Commandments of needs basedWhy Trends firmly on their own experiences as users.The Awwwards community are afaithful audience, always interested Trends is not only a prediction forin learning and dedicating their 2013. It reflects a natural interest intime to acquiring the necessary how all aspects of web design willtechnical knowledge to apply in evolve over the next few years. Wetheir daily work. With the noble don’t actually know whether we willaim of being a useful tool for our need to make a similar publicationcommunity, at the end of 2012 we in 2014; things in this industrydecided to gather the opinions change quickly, so it’s possibleof renowned experts on how the that in less than 12 months manyweb industry will evolve in the of these trends and technologiescomplex times we live in, in this which now seem to be blossomingtower of Babel of technologies and will have disappeared completely. “devices that’s rushing towards us. The idea was to ask all the participants more orOf course, nobody can know for less the same questions tosure what might happen in thecoming months and years. In fact, get a kind of data map. ”“ Trends is not only a pre-diction for 2013. It reflectsa natural interest in how all How is the structured? documentaspects of web design will The idea was to ask all theevolve over the next few participants more or less the same ” questions to get a kind of “datayears. map” which would help us visualize “the future of the web”. To thismany of the interviewees were end, we had the invaluable help ofhesitant to give an opinion on 28 renowned experts in differenttrends. Curiously, in the end some areas of the industry. They are thevery similar ideas emerged to make ones who have given this projectup, more than a prediction, a Ten its shape. Web Design Trends 2013 5
  6. 6. The end motivation?Honestly... you’ll see why as youread the document, because thisis exactly what can be taken fromalmost all the contributions...building a more useful, accessibleand efficient web for the userwithout forgetting that design is apowerful tool that not everyone isable to use with skill and honesty. Web Design Trends 2013 6
  7. 7. Interviews Chapter. 2 Web Design Trends 2013 7
  8. 8. Dan MallDesign Director at Superfriendly Co. “We’ll see people moreDan Mall is an award-winning designerfrom Philadelphia. Founder and DesignDirector at SuperFriendly, co-founder of broadly understandingTypedia and swfIR, and singer/ keyboardplayer for contemporary Christian bandFour24. Dan writes about design and mobile devices. ”other issues on Twitter and his website. Web Design Trends 2013 8
  9. 9. W hat trends do you see co- ming in the near future inweb and mobile design? around touch interactions. Here’s one of my recent favorites by Rally Interactive co-founder Ben Cline.I’ve never been good at predictions,but I think (hope)? we’ll see peoplemore broadly understandingmobile devices—computers wecan hold in our hands as opposedto having to sit at a desk to use—asthe web, not just an “on-the-go”,abridged version of the web. What do you think we’ll see in la- yout and UI design in 2013?What animation techniques and Simplicity, app-inspired design,effects applied to navigation and responsive, single page websites,user interaction will we see? Will alternative navigation patterns…?we finally move beyond Parallaxscroll? There’s an interesting battle currently being fought betweenGosh, I hope so. I’ve seen very photorealistic graphics and flatfew sites that use parallax as a aesthetics, led by Apple andconceptual construct as opposed Microsoft’s Windows 8. I think we’llto a technological gimmick. see a lot more push and pull withAs touch-enabled devices are these styles over the next year.“ As touch-enabled de-vices are becoming moreubiquitous, I think we’ll Touch and gestures, media que- ries, responsive, retina display, webfonts, realtime web... Howsee a lot of experimenta- do you think these techniquestion around touch interac- and technologies will evolve and ”tions. what will be next? It’s interesting to see design andbecoming more ubiquitous, I think technology simultaneously gettingwe’ll see a lot of experimentation Web Design Trends 2013 9
  10. 10. bigger and smaller. On one end nes will you be focusing on in theof the spectrum, we find browsers coming months and years?evolving more rapidly than ever, Everything! We’re certainlywith designers and developers doing the web work we love sopushing technologies like WebGL, much, HTML/CSS/JS,mobile-firsthardware acceleration, and 3D in responsive design, WordPress,the browser without having to rely ExpressionEngine/otherCMS’s—on plugins. On the other end, we but are also venturing a bit intosee mobile access necessitating Objective-C and OpenFrameworkssimpler, faster sites and heralding as we do more native mobile work.the need for optimizing. I’m curious We’re even creating some physicalto see how each evolves. installations that connect digital and analog. More on that soon!When looking for potential em-ployees or collaborators whatcatches your eye?Great design taste in a portfoliousually gets my attention, but what“ Great design taste in aportfolio usually gets myattention, but what keepsit is hunger and passion forthe work. ”keeps it is hunger and passion forthe work. I also try to look for someform of richness; I like seeing smallmoments where it’s obvious thathe/she pored over the details.What technologies are your teamtraining in now? Which discipli- Web Design Trends 2013 10
  11. 11. Karen McGraneContent, User Experience Strategist Image by Alison Grippo “ Mobile is not the LiteKaren McGrane is a content strategistand user experience designer with15 years of experience making big, version. I think this willcomplicated websites. Currently she is be year of the mobileManaging Partner of Bond Art + Science. website, no more desk- top redirects. ” Web Design Trends 2013 11
  12. 12. W hat trends do you see co- ming in the near future inweb and mobile design? will want to do that on mobile,” you’re too late. People are already trying to do it. It’s our mission—and our responsibility—to deliver a greatMost major organizations are experience to them, on whateverstarting to see about 10% of the device or platform they choose totraffic to their website coming from devices—which means it’stime to move on putting a content 2. Content parity is the goal. Toostrategy for mobile in place. I think often, we fall into the trap ofthis will be the year of the mobile thinking mobile should be the “lite”website, no more desktop redirectsor bare-bones landing pages. It’stime to think of the mobile website “ We fall into the trap of thinking mobile should be ”as every bit as “real” as the desktopwebsite. the lite version.“ version, offering a subset of content You don’t get to decide and features. Or we just want it towhich device people use to be different for the sake of beingvisit your website. They do. different. For most organizations,” providing a consistent experience across the desktop web and mobile web should be the foundationalWhat should be the new design goal.principles for web and mobiledesign? 3. It’s not a strategy if you can’t maintain it. Lots of great ideas flopI have three big principles that in the execution, because no oneinform my approach to content took into consideration what wouldstrategy for web and mobile. be required from the internal web, production, or editorial teams. With1. You don’t get to decide which digital teams now juggling lots ofdevice people use to visit your different platforms, it’s even morewebsite. They do. If you’re sitting important to focus onaround debating whether “people Web Design Trends 2013 12
  13. 13. the needs of the people who will see increasing numbers of wildlymaintain the site. divergent platforms, some of which we’ve been talking about for years.What do you think we’ll see pre- Interactive television. In-kitchendominate in layout and UI design devices. In-car audio 2013? Someday soon, speech-basedI expect to see growing recognition interfaces will get good enough—from the design community that remember all the years whenthe content can’t be “somebody touchscreens sucked? Onceelse’s problem.” Designers have touchscreens reached thea huge stake in knowing “what point where they just worked, it launched an entire new wave of“ innovations in hardware, software, Designers have a huge and interaction models. Speechstake in knowing what the isn’t there yet, but it will be.content will be. ”the content will be.” What that This means that we have to stop building containers and thenmeans is that designers should creating content to fit. Our contentbe asking about “how the content is going to find its way to placeswill be structured.” What are all we never even dreamed, and wethe chunks, and how big are they? don’t have the time, resources,Instead of treating the content or budget to create new contentlike an afterthought, or something for every platform. Instead, allwholly separate from the rest of the of us need to work together–experience, designers will make designers, developers, and contentsure it’s the centerpiece. strategists—to create the right content, structured for reuse, andIn technological and social ter- then design around, how do you think the webwill evolve in the next few years?The proliferation of platformsisn’t going to stop. We’re going to Web Design Trends 2013 13
  14. 14. Jenn LukasInteractive Development Director at Happy Cog “ This year I hope to seeJenn pursued a Multimedia WebDesign degree. She has worked onnumerous projects for top-tier clients content still at the fore-and was named one of Mashable’s 15Developer/ Hacker Women to Followon Twitter, and you can find her on front. ”Twitter posting development and cat-related news. Web Design Trends 2013 14
  15. 15. W hat trends do you see co- ming in the near future inweb and mobile design? an ease into responsive design and less pages to load/clicks to make. This year I hope to see content still at the forefront, but pushingI just LOVE CSS Transitions, into more complicated designsespecially when applied to hovers. and layouts. Flexbox (CSS FlexibleAdding the right amount of fade Box Layout Module) is sure toor movement to a link, really adds help in aiding interesting layoutsa helpful amount of interaction on desktop and mobile that aren’t dictated by source order.“ Filters cut down on imagesprites and image produc-tion and let you adjust yourimages right in the brow-ser. ”while keeping things classy andnot going the way of Flash tweens.CSS Filters are super neat! With lotsof people pushing for designingin the browser, this is one morestep away from an image editor.Filters cut down on image spritesand image production and let youadjust your images right in thebrowser.What do you think we’ll see in la-yout and UI design in 2013?We’ve seen a lot of single columndesigns and single page websitesthis year, allowing a content-firstapproach. These patterns provided Web Design Trends 2013 15
  16. 16. Mike KusGraphic, Web Designer Illustrator “ I think we’ll see a sim-Mike Kus is a UK based Graphic/ WebDesigner and illustrator, considered oneof the best on today’s scene. He’s co- pler web emerging. Morefounder of WorkFu and creator of a few space, less clutter and decoration. ”amazing online and print experiences. Web Design Trends 2013 16
  17. 17. W hat trends do you see co- ming in the near future inweb and mobile design? focused on user experience and content? I don’t think it’s a new thing toFrom a visual standpoint I think suggest that user experiencewe’ll see (are already seeing) a and content are a central focussimplification of Graphic UI design when designing for the web andon both the web and mobile. We’ll mobile. It’s always been that waysee less decoration, simple, bold as far as I’m concerned. I’ll justand clear layouts and UI design. I carry on applying the same design“ Simplification of Graphic UI and mobile design on “ Make sure the content is easily digestible using a ”both the web and mobile. simple clear layout.Less is More. ”think we’ll see less Apple influenced principles I’ve always used, which are pretty simple: Make sure theskeuomorphic design, also. content is easily digestible using a simple clear layout, the text is easyWhat technologies are you tra- to read, and the site or app is easyining in now? Which disciplines to navigate and understand. Applywill you be focusing on in the co- these to all devices.ming months and years? What animation techniques andIn the coming months I want to effects applied to navigation andfurther explore the concept of user interaction will we see? Willhow to best express a brand or we finally move beyond Parallaxpersonality through web design scroll?and how this can be maintainedfrom the desktop experience Scrolling triggered animationsthrough to a mobile experience. seem to be hot right now but I’m really not sure what will come next.What should the new designprinciples be in a future whereweb and mobile design must be Web Design Trends 2013 17
  18. 18. What do you think we’ll see in la- graphics take the pain away whenyout and UI design in 2013? it comes to designing for differentSimplicity, app-inspired design, screen resolutions. Creatingresponsive, single page websites, multiple graphics for differentalternative navigation patterns...? screen types is a total pain in the ass.Again, I think we’ll see a simplificationof UI design. Less is more. In technological and social ter- ms, how do you think the webCan we predict an explosion of will evolve in the next few years?creativity in interaction and ani-mation now that the technology I think we’ll see the web furtheris available and becoming more integrated into our everyday lives.accessible from a web standards Only a few years ago ‘the web’point of view?I think as long as the browser “ We’ll see the web further integrated into our every- ”support is in place, yes, designers day lives.and programmers will be doing was surfing the web from your“ I don’t think human appe- desktop and email. Now the web is on your mobile, there’s an apptite for clever animated web for everything from taking andpages will ever die. ”some pretty crazy stuff. I don’tthink human appetite for clever sharing your photos to mapping your run to monitoring your car’s performance. This integration willanimated web pages will ever die. only become deeper.Clients love that stuff!What role do you think techno-logies like Canvas or ScalableVector Graphics (SVG) can play ingame and app development?Well, for one, scalable vector Web Design Trends 2013 18
  19. 19. Nick PettitTeaching Team Leader at Treehouse “ I think SVGs willNick Pettit is the Teaching Team Leaderat Treehouse, an educational videotutorial service that teaches web design, become more popularweb development, and iOS. Nick has a due to the increasing po-background in fine art and a passion for pularity of displays with ”technology. high pixel densities. Web Design Trends 2013 19
  20. 20. W hat trends do you see co- ming in the near future in backlash from the skeuomorphic or hyperrealistic sensibilities of Apple “web and mobile design/ develo- I think the recent bac-pment? klash from the skeuomor-Screens with high pixel densities phic or hyperrealistic sensi-like the new iPad and MacBook bilities of Apple are leadingPro will become more prevalent. towards an aesthetic thatResponsive Web Design solvespart of the puzzle and forces us to features more flat colors, which is the perfect use“ Design must become evenmore pixel agnostic. I thinkdesigners will start using an case for SVGs. ” are leading towards an aesthetic that features more flat colors,SVG-first approach. ”think in terms of proportions, but which is the perfect use case for SVGs. Internet Explorer has added support for SVGs in recent releases,now design must become even so this approach is now far moremore pixel agnostic. The best way do this currently is with vectorgraphics and I think designers will What technologies are you tra-start using an SVG-first approach ining in now? Which disciplineswhen creating graphics for their will you be focusing on in the co-web pages. Internally at Treehouse, ming months and years?we’ve taken a note from Responsivedesign and have dubbed this idea I’m personally focused on“Scalable Web Design.” Vectors are researching how vectors impactnot practical for more complex design and UX decision making.imagery, particularly photographs, While vector graphics do havebut they work well in many cases, a few drawbacks, they have aespecially when you go into the tremendous number of advantagesdesign phase knowing that this that allow for interfaces that are notwill be the driving technology. practical with raster images alone.Additionally, I think the recent Web Design Trends 2013 20
  21. 21. What technologies are you tra- What will the trends be in webining in now? Which disciplines programming? Which langua-will you be focusing on in the co- ges or frameworks will gain moreming months and years? converts in the near future?I’m personally focused on I don’t see any ground breakingresearching how vectors impact changes in languages ordesign and UX decision making. frameworks in 2013, although thatWhile vector graphics do have doesn’t mean there won’t be any.a few drawbacks, they have a Rather, I think the focus will be ontremendous number of advantagesthat allow for interfaces that are notpractical with raster images alone. “ I think the focus will be on the toolchain that front- end and back-end deve-What should a newbie web deve-loper concentrate on learning? lopers use to create webA new web developer should learnto love learning. The best web apps. ” the toolchain that front-end anddevelopers are very flexible and back-end developers use to createadaptable to change. They don’t web apps. The barrier to entry for new designers and developers is a“ little bit high, but projects and tools The best web developers like HTML5 Boilerplate, Bootstrap,are very flexible and adap- Github, Ruby on Rails, Heroku, andtable to change. They don’t countless others have continuouslyspend all of their time fo- systematized the process. I think this positive momentum will continue,cusing on just one langua- ” because it allows developers toge. focus more on their ideas, ratherspend all of their time focusing than the implementation.on just one language, and instead,experiment with all the possibilities. Web Design Trends 2013 21
  22. 22. “ The fight for web standards is finally in a much betterplace than it was in previous years, ”How do you think these techni- to freely experiment with bold newques and technologies will evol- interface and what will be next? The current state of developmentTechnologically, I think SVGs will and design is pretty incredible, andbecome more popular due to the while it will continue to improve,increasing popularity of displays there’s never been a better time towith high pixel densities. Beyond build web applications. Now is thethat, it seems like the fight for web time to execute.standards is finally in a much betterplace than it was in previous years,and the ongoing refinementsto the tools that are available to“ Furthermore, companiesand individuals care moreabout design than ever be-fore. ”developers are a welcome additionto the equation. Furthermore,companies and individuals caremore about design than everbefore. Big influencers like Appleand Microsoft have shaken up thelong-standing desktop metaphorwith iOS and Windows 8, and theworld didn’t come crashing downaround them as one might expect.I think this gives smaller productcompanies the comfort they need Web Design Trends 2013 22
  23. 23. Dave RupertLead Developer at Paravel Inc. “ I think the future ofDave Rupert is the lead developer forParavel and host of “the ATX Web Show”,a podcast about the local web design web and mobile design isand development scene in Austin, Texas. that there is no distinc- tion between the two. ” Web Design Trends 2013 23
  24. 24. W hat trends do you see co- ming in the near future inweb and mobile design? term. My knowledge of those two things is decent but could always be better and more informed. Over the next few months I’ll probablyFor me, I think the future of web just continue poking holes in whatand mobile design is that there is I think I know so I can get better atno distinction between the two. my weaknesses.Smartphones are becoming the What should a newbie web deve-“ The future of web and loper concentrate on learning?mobile design is that there There’s a saying we have onis no distinction between ShopTalk (a podcast I co-hostthe two. Mobile first res- with Chris Coyier): “JUST BUILDponsive web design is pro- WEBSITES!” The technologies thatbably the trend to stick with you need to be learning will quickly ” present themselves in challengesin the near future. you meet when you pick up a side project, start a job, etc. Beyonddefault computer for most of the that, gaining more mastery onworld’s youth, a company in India the three main building blocksjust announced a $20 tablet, and of our industry - HTML, CSS, andcollege classrooms are glowing JavaScript - couldn’t hurt.with high-end laptops. Mobile firstresponsive web design is probably What will the trends be in webthe trend to stick with in the near programming? Which langua-future. ges or frameworks will gain more converts in the near future?What technologies are you tra-ining in now? Which disciplines I believe automation and betterwill you be focusing on in the co- tooling is the next wave (ifming months and years? not already a current wave) in web development. This coversI’m focusing a lot more on JavaScript everything from pimping your textand Web Accessibility in the short editor to improving the building Web Design Trends 2013 24
  25. 25. and compiling of our HTML/CSS/ Microsoft’s Windows 8 is a touch-JavaScript. Linters, pre-processors, based interface. Chris Coyierbuilders, and package managers recently tweeted that he saw hiswill play a major role in everyday mom try to tap her TV. Touch-web development. There may enabled devices are now the defaultbe a big technical hurdle there stack, so it’s important that our designs have this in mind. I don’t“ Linters, pre-processors,builders, and package ma-nagers will play a major role think we’re far off from where our websites will be expected to have more advanced gesture-based everyday web develop-ment. ”to get everyone on board, butthat’s a great opportunity to fordevelopers to make GUIs in orderto increase adoption among lesscommand-line-savvy developersand designers.Touch and gestures, media que-ries, responsive, retina display,webfonts, realtime web... Howdo you think these techniquesand technologies will evolve andwhat will be next?Touch and gestures will be hugely“ Touch and gestures willbe hugely important. ”important. Apple’s biggest sellingproducts are all touch-based. Web Design Trends 2013 25
  26. 26. Veerle PetersGraphic, Web Designer Lead at Fab “ It’s important to designVeerle Pieters is a graphic/ web designerbased in Deinze, Belgium. She runs herown design studio, Duoh!, together from the content pointwith Geert Leyseele. Veerle has been instead of screen resolu- tions. ”blogging since 2003 and is considerednumber 39 on the list of “NxE’s FiftyMost Influential Female Bloggers“. Web Design Trends 2013 26
  27. 27. In technological and social ter- ms, how do you think the webwill evolve in the next few years? What should the new design principles be in a future where web and mobile design must be focused on user experience andHard to say, as I’m not visionary content?so I can only do some guesswork.Technologically, it will be moving I’m hardly an expert, but I thinkmore and more towards mobile, there is no golden rule that appliesso that aspect will become even to all. Every project is different so that’s why it is so hard to create“ Technologically, it will the ultimate process/ tool that everyone likes to use and thatbe moving more and more “towards mobile, so that I think it’s important toaspect will become even design from the contentmore important than it now point instead of focussingalready is. ” on all the screen resolu-more important than it now alreadyis. I see shopping as one aspect of tions out there. ” works perfectly for every project.that, and I think we will eventually I’m not sure if such a thing ismove towards 50% being done even possible. It’s a collection ofon phones or tablets. Of course, best practices and tools basedthis will not work for every shop, on personal preference that webut shops like will get have at our disposal today. Withto that point quicker than others. the complexity of all the devicesSocially, I have no idea if Twitter or out there, I think it’s important toFacebook will still be relevant in 5 design from the content pointyears. It all depends of what those instead of focusing on all the screencompanies do with their product. If resolutions out there. That’s what Ithey alienate their customers, and think would qualify as a new newa new kid on the block profits from design principle.that, it wouldn’t be the first time. Web Design Trends 2013 27
  28. 28. Can you pinpoint any visual as we are still very much in thetrends or design elements that experimental phase, so nobodymight emerge in 2013, as Letter-press, pictograms, vintage style,lettering, oversizing elements,Overprinted effects, swiss design “ Could be I’m wasting my time on something that isn’t around anymore inetc. have done? two months. Things pop-Trends are something I don’t follow up quickly but disappear asor have any interest in. I just dowhat is right for the project thatI’m doing at that time. If it involves fast too. ” knows yet what the best practicessomething that many believe is of tomorrow will be. Could be I’mover-used, so be it, as long as I feel wasting my time on something thatit has a purpose there. I never look won’t be around anymore in twoat any website galleries because months. That’s what makes it sothey usually have a reverse effect interesting, things pop-up quicklyon me, and they block my creativity but disappear as fast too. Nobodyfrom the overload I receive. That’s knows what will be *the* way inwhy I created my own inspiration 2015, for example. We all have tostream that has nothing to do with learn as we go.web design at all. I try to see myinspiration in things that have noconnection to what I’m designing.For me personally, that works fine,but other may feel differently.What techniques are you trainingin now? Which disciplines willyou be focusing on in the comingmonths and years?I’m learning about all the informationon responsive web design, retinaresolutions etc. Not an easy task, Web Design Trends 2013 28
  29. 29. Denise JacobsWeb Design Consultant and Creativity Evangelist “ Storytelling and visualDenise R. Jacobs is an Author, Speaker,Web Design Consultant, and CreativityEvangelist. Based in Miami, Florida, she simplicity in web andis the author of “The CSS DetectiveGuide” and co-authored “InterAct withWeb Standards: A Holistic Approach to mobile design. ”Web Design” and the newly-releasedSmashing Book #3 and #3 1/3. Web Design Trends 2013 29
  30. 30. W hat trends do you see co- ming in the near future inweb and mobile design? ges or frameworks will gain more converts in the near future? It seems like there will be aI hope there will continue to be an continued increase in methods toincrease in both storytelling in web manage front-end developmentand mobile design as well as visual better like the scalable and“ modular CSS architectures, and People are starting to see also CSS preprocessing languagesthe power of storytelling in like LESS, SASS, and COMPASS.web and mobile in reaching I also anticipate more peopleaudiences. ”simplicity. People are really starting “ It seems like there will be a continued increase in me-to see the power of storytelling in thods to manage front-endreaching audiences and in creatingproducts that resonate with people.What technologies are you tra- development. ” challenging well-established front-ining in now? Which disciplines end development solutions andwill you be focusing on in the co- devising new ones, especially asming months and years? the CSS3 specification gets more solidified.I’m moving away from trainingin specific technologies and am Touch and gestures, media que-instead focused on developing ries, responsive, retina display,strategies for how to think webfonts, realtime web... Howbetter under pressure, increase do you think these techniquesthe creativity, innovation and and technologies will evolve andproductivity of individuals and what will be next?teams, and produce and executemore great ideas in less time. All of these technologies are pushing innovation and fresh-What will the trends be in web thinking forward, which I love toprogramming? Which langua- see. While I don’t know how they Web Design Trends 2013 30
  31. 31. continue to evolve, I do know that website and the app interfaces,the next several months will be where they both are simplified toripe for some fantastic new ways the point where there will be littleto approach designing with all of or no difference between the two.the aforementioned combined.What do you think we’ll see in la-yout and UI design in 2013? Sim-plicity, app-inspired design, res-ponsive, single page websites,alternative navigation patterns...?Over the years, we have seen ashift from ridiculously complexinterfaces (think the Flash-basedwebsites of the early 2000’s) to“ I am looking forward tomore designers who alsoknow code who understandwhat is truly necessary. ”more simple and stark interfaces.Much like the well-knownAntoine de Saint-Exupery quote“Perfection is achieved, not whenthere is nothing more to add, butwhen there is nothing left to takeaway”, I am looking forward tomore designers who also knowcode who understand what istruly necessary, and in striving forperfection, continue to take awaythat which is superfluous. Also, Ido anticipate more merging of the Web Design Trends 2013 31
  32. 32. Simon FosterWeb Designer “ The thing to focus onSimon Foster is a tiny one-man webdesign studio in London, England. Hespecialises in responsive front-end is not How a website’sdesign, HTML/ CSS and web typography. design/layout/UI is exe- cuted but Why. ”Simon tries to make the websites hedesigns and builds as simple and intuitiveto use as possible whilst still having aunique aesthetic appeal. Web Design Trends 2013 32
  33. 33. W hat tendencies do you see coming in the near futurein web and mobile design? old HTML CSS as I’ll never be a programmer as it isn’t in my blood, but I’ve recently started to learn how to use github and I’ll beI think that there a still a surprisingly making a concerted effort to getlarge amount of web designers to grips with SASS soon as they’rethat don’t take mobile devices intoproper consideration. I still see sitesthat are beautiful on a desktop orlaptop but really difficult to use on “ If you haven’t thought about WHY you’re making this website it won’t meanmy phone or tablet. That can’t goon forever so I think we’ll see a lotof designers getting on board withresponsive/adaptive design or just anything. ” not really as scary as they seem atsimplifying the way they design first. On the other hand I’m alwaysand build sites so even if they aren’t conscious of not getting too bogged down in focusing on the“ “how” For me the “why” in design Less gimmicks, less tric- will always be more important.ks, less dependency on ja- Any type of code, technology orvascript for a site to work.responsive they are easier to use ” framework is only ever a means to an end, you can be the best Ruby on Compass Jekyll, Git via Haml,on smaller devices. Less gimmicks, Frank Sinatra singing Mongo DBless tricks, less dependency on Jerry programmer in the world, butjavascript for a site to work. if you haven’t thought about WHY you’re making this website it won’tWhat technologies are you tra- mean anything.ining in now? Which disciplineswill you be focusing on in the co- What should the new designming months and years? principles be in a future where web and mobile design must beWell even though I do write code focused on user experience andas well as design I’ve only really content?up until now gone as far as plain Web Design Trends 2013 33
  34. 34. I think I can see things going back to was that we could get away frombasics a bit. I love the phrase “Keep over-bloated sites that needed toit simple stupid” (even though it is load before you could use thema little over used). Just let users do and had loads of unnecessarywhat they came on your site to do transitions and animations, but they’re making a comeback with“ I always keep it in mindthat no matter how beau-tiful I make a website the “ I’m not a big fan of things moving all over the screen,average user only really just feels like a gimmick toowants to spend about 10seconds on it. ” often for me.. ” html5 and canvas/webgl etc.quickly and without fuss so they Of course I’m not saying NEVERcan get on with doing other things use an animation in a website,that are more interesting. I always when done with subtlety and inkeep it in mind that no matter how the right context they can be great,beautiful I make a website the but more often than not I find themaverage user only really wants to annoying, but that might just be myspend about 10 seconds on it, so taste, others will probably disagree,let them do that, cut the crap. which is a good thing.What animation techniques and What do you think we’ll see in la-effects applied to navigation and yout and UI design in 2013?user interaction will we see? Will Simplicity, app-inspired design,we finally move beyond Parallax responsive, single page websites,scroll? alternative navigation patterns...?Personally I hope we don’t see any, I think this comes back to “why”I’m not a big fan of things moving and “how” again. The thing to focusall over the screen, just feels like a on is not how a website’s design/gimmick too often for me. When layout/UI is executed but why. Asflash websites died one of the long as the way you’ve chosen tothings that I was pleased about build and design your site works Web Design Trends 2013 34
  35. 35. for that particular project thengreat. Whether it’s single-page,responsive, light, dark, covered ingradients or really minimal doesn’treally matter as long as it works forthat particular clients site. Trends or“ I think this comes backto WHY and HOW again.The thing to focus on is notHow a website’s design/layout/UI is executed butWhy. ”movements in web design are notsomething that I think a designershould really be trying emulateor follow when starting a newproject, just because everyoneelse is making minimal, responsiveone-page sites that look like appswith circles for navigation andFutura for body text, doesn’t meanthat’s right for what you’re workingon. Do your own thing, ignoretrends, start your own trends if youfeel like it and above all think aboutwhat the end user needs from whatyou’re creating. Web Design Trends 2013 35
  36. 36. Bruce LawsonEvangelist of Open web standards “ I think simplicity’s theOpera evangelist, co-author of“Introducing HTML5” and web standardslovegod. Guinness-drinking, kickboxing point. Mobile stuff needspoetry freak. Man with MS. to be simple, but so does everything else. ” Web Design Trends 2013 36
  37. 37. D o you think the kind of sim- plicity we see in apps is goingto be a big thing in design more Do you think web-standards ba- sed Apps will end up putting an end to native Apps?generally? I doubt standards-based AppsYes. I think simplicity’s the point. I will completely kill native Apps. Ioften say to people about mobile, think native Apps are temporarilythe usability gurus always point to very important because the web-standards stuff hasn’t yet got“ I think simplicity’s the the capability of the native stuff, but the gap’s closing.point. Mobile stuff needsto be simple, but so does What trends do you see comingeverything else. ”mobile as being different because in the near future in web design? Access to devices capabilities. So,people are time-constrained three years ago, if you wantedand task-focused, and therefore to access GPS geographicalyou should only give them the information on your phone, youinformation they need to fulfil the had to have a native app becausetask. That’s true, but it’s also true you couldn’t do that on the web,of everybody all the time. If I go to and now every browser on everya train website, I don’t really want device is doing that. And thento see a picture of Richard Branson the ability to upload photographssmiling at me, I don’t want to readthe Chief Exec’s ambitions and lifehistory. All I want to know is what “ Access to devices capa- bilities, GPS, microphone, ”time my train is and how much camera, is. And I think, yes, mobile stuffneeds to be simple, but so does directly from the web, which weeverything else. People have been can do now. There’s somethingused to making desktop sites that called getUserMedia, a spec Iare full of shite just because they’ve very much like, and that allows agot space for it, and they need to website (with your permission) tostop. access the videocamera, it might Web Design Trends 2013 37
  38. 38. be a webcam or the front-facing imagine in the next 12 months that’llcamera on your phone, and then be available in the newest browsersit can access the video stream on devices that have that capability,and film you and the Javascript yeah. That’s all part of web RTCon the website accesses the [Real Time Communication] at thevideo feed in real time and can moment.identify where your face is anddo facial recognition, and when You did a talk on what’s next init determines where your mouth Responsive web design, whereis it’ll draw a Super Mario Brothers you mentioned web on TV. Is thatmoustache where your mouth is. what’s next?And this, of course is the zenithof tech. But what this is really for The TV manfacturers really wantis in-browser video conferencing, web on TV to work. I think at theso the website can access your moment the killer app hasn’t beenmicrophone and your camera and “then connect it up to someone The TV manfacturers rea-else’s website where they can hear lly want web on TV to work.your voice. You’ve effectively gotvideo conferencing with no third- I think at the moment theparty app. killer app hasn’t been in-“ I imagine in the next 12months that’ll be available vented. ” invented. Nobody’s yet come up with the killer product. TV’s greatin the newest browsers on for some things and it’s rubbishdevices that have that ca- for other things. Nobody is goingpability, that’s all part of to want to put all their socialweb RTC [Real Time Com- networking stuff up on the telly ” when your grandma and yourmunication]. kids are in the same room. There’s things you don’t want in a familyI can’t promise anything for Opera, space. You’re unlikely to want toand I certainly can’t promise type an e-mail on the TV becauseanything for anyone else, but I your hunting and pecking with Web Design Trends 2013 38
  39. 39. the remote for the letters and it’s I’ve got differentiation. I think that’srubbish. But then TV’s great for increasingly the case, people wantshared viewing, so I could imagine to have that separation, otherwisethat a killer TV app would let you you just work all the time.look at your Flickr pictures as aslideshow, so instead of the family Have you read anything recentlygathered round a laptop, the family that’s particularly made an im- pact?“ TV’s great for sharedviewing, so I could imaginethat a killer TV app would Yes, I read the W3C Pointer Events Specification, which Microsoft wrote, which is making writinglet you look at your Flickr websites that work with a pen orpictures as a slideshow. ”can be gathered round a big screen touch or a mouse much more sane and easy and I think it’s good work by the mighty Microsoftand it’s more sociable. I think that standardising yet, the technology is there, butwe haven’t yet worked out how to What kind of technologies areuse it best. you looking at learning? Any new stuff you want to get into?“ Nobody wants to writea Word document on their I’m not a very good Javascripter, so I’m looking to improve that andtelevision. ”Nobody wants to write a Word I’m ultimately interested in just improving my general scripting ability, so I’ve got a book on Pythondocument on their television, to read on the train. With a degreebecause a) it’s rubbish as an in English Lit and drama, I’m not aexperience because you haven’t got natural computer person and I’ma keyboard, and b) TV’s leisure, and a bit slower than someone who’swriting a Word document’s work. I done a degree in computer science,work from home so I make sure I but I’m interested in learning thatonly work in my office and the only kind of stuff yeah.thing I do in my office is work, so Web Design Trends 2013 39
  40. 40. For someone who’s starting out, most politicians in the Westwhat would you tell them to learn are politics and philosophy andfirst? economics graduates, and most politicians in China are engineers,“ But anyone who tells and there’s a huge focus and a huge respect for engineering out there.them to just learn Javas- You see some phenomenal codecript because HTML and and dedication to making greatCSS are easy, not to listen stuff coming out of China, and also ”to them. India. Places like Bangalore, there’s incredible coding in India.Well if they want to learn web stuff,to learn HTML5 and CSS and thento learn Javascript. But anyone whotells them to just learn Javascript “ We’re seeing an extraor- dinary rise in consumption of the web in those pla- ”because HTML and CSS are easy,not to listen to them because it’s ces.easy to be rubbish at them and it’shard to be good at them, to write We’re seeing an extraordinary risegood, structured code. The best in consumption of the web in thoseway is view source. Find good places. Not so much producingwebsites that people recommend, websites, although Chinese socialand hit view source, then muck media has just been creditedabout with it. this week with persuading their government to close down someYou mentioned India and Chi- of the forced labour camps, sona. How do you think those fast- we’re seeing technology enablinggrowing economies might affect people to have a voice and a say,the web and mobile industries in which warms the cockles of mythe future? heart.They will affect it in ways I can’t I’m going to tell a story this afternoonguess at, but the effects they’ll have about a website called Igniter. Itwill be profound. China, particularly. was set up by three Jewish guys inSomebody told me that statistically, New York and it’s a social network, Web Design Trends 2013 40
  41. 41. a dating agency, for nice, Jewish and they’re going great guns there,kids in New York who for cultural and that’s the beauty of the Worldreasons didn’t want to go out on Wide Web. That’s what you losedates one-to-one. So they would if you only think about your ownorganise shared trips to the theatre local area. You might think youror picnics, so groups would go out business is only focused on yourand if people hit it off they could local area but if you deliberatelysubsequently begin dating, but it restrict it you’ll never know whetherwas culturally a lot less intimidating. you have a more global businessIt didn’t take off, they spent lots of advertising it but they onlygot 50,000 users. And then theynoticed they were getting loads of“ That’s the beauty of theWorld Wide Web. That’swhat you lose if you onlythink about your own localarea. ”hits from India and Pakistan andplaces like that, where there’s nota great Jewish community butthat model of shared dating worksvery well with extended Hindu andMuslim and Sikh families. Theyrealised that they were gettingmore signups a week from Indiathan they had in their first year in theUS, so they just relocated it. Thosethree guys who had never beenout of North America all relocatedto Bombay and they re-brandedas India’s premier dating agency Web Design Trends 2013 41
  42. 42. Luciano FogliaMultidisciplinary Visual Artist “ I think we will see aLuciano Foglia is a multidisciplinaryvisual artist based in Berlin and London.He has been working in interactive lot more applications indesign, art and music since 2001. His integration with otherpersonal time is spent exploring new services, taking the web ”ways of expression in music, design and beyond the He works commercially as a SeniorInteractive Designer and Art Director. Web Design Trends 2013 42
  43. 43. W hat trends do you see co- ming in the near future inweb and mobile design? Art Director and Senior Interactive Designer, so I don’t only look for means of expression on the web (even if this one is my main channel).This is a transition moment in the I’m also interesting in other fields. Iweb design industry. I can see mostly use web technologies formany interesting possible trends my personal projects because ofcoming up. Change is always their accessibility. What I’m traininggood, and it’s great to see how in now is WebGL as a platform tomany designers and artists are receive external stimulus as midi“ I see lots of simple andbeautiful interactive designconcepts coming in the “ WebGL could become a very powerful tool for vi- sual artists to express ideasfuture. Expect a focus ontypography and getting the through the web. ” signals, sound and moving out of HD displays.taking on these challenges to ” I think it’s a great technology and still pretty fresh. I believe it could become an amazing platform forexperiment with new technologies the web, but still like many othersand improve the user’s experience needs a high level of understandingon all platforms. So going back to of code. We have seen verythe question, I see lots of simple interesting projects done with thisand beautiful interactive design technology, but not as many Iconcepts coming in the future. would like to see. Or maybe not inExpect a focus on typography and the way I would like to see them.getting the best out of HD displays. I’m blown away every time I see it’s potential. It could become a veryWhat technologies are your team powerful tool for visual artists totraining in now? Which discipli- express ideas through the web. Ines will you be focusing on in the believe the key is to think outside thecoming months and years? box so that we don’t limit ourselves just to what the technology wasI’m a visual artist and I work as an made for. Web Design Trends 2013 43
  44. 44. In standards-based web design, In technological and social ter-what animation techniques and ms, how do you think the webeffects applied to navigation and will evolve in the next few years?user interaction will we see? Willwe finally move beyond Parallax I think we will see a lot morescroll? applications in integration with other services, taking the webAs we overcome some performance beyond the browser. This makes lifelimitations we will see more rich a lot easier for users and improvesexperiences to come. For sure theemphasis is on “graphic design witha sense of depth” at the moment.Because of this, the scroll gained “ I think we will see a lot more applications in inte- gration with other services,importance like never before, notonly to browse the content but also taking the web beyond theto interact with it. I would like tosee how we creatively take betteradvantage of it in integration with browser. ” productivity. In social terms the internet is playing a very interesting“ I would like to see how role, not only on a daily basis but also for long-term social changewe creatively take better purposes. What we saw in Egyptadvantage of integration in 2011 was a clear example ofwith 3D techniques.3D techniques. Moving beyond ” how social media can accelerate a revolution, and we are also seeing it in other parts of the world. TheParallax scroll is a matter of time. It internet belongs to the people andwill happen as soon as users start it can represent unrepresented andto adopt new ways of navigating marginalised sectors of society andthe content. Every step towards provide them with a platform to beproviding a more interactive and heard.immersive experience on the webis a new learning process for theusers. Web Design Trends 2013 44
  45. 45. Ben ClineInteractive Designer at Rally Interactive “ Most innovation withCo-founder and creative director atRally Interactive. Ben is passionateabout interactive design, experiences interaction will be throu-and strategy. gh Web GL and native apps. ” Web Design Trends 2013 45
  46. 46. W hat technologies are your team training in now?Which disciplines will you be fo- we finally move beyond Parallax scroll?cusing on in the coming months The Parallax effect won’t die anyand years? time soon. It has been around for as long as I can remember (inRally Interactive is focused on the early days of Flash and for acreating engaging and intuitive long time in film). When it comesinterfaces. The technology behind to touch screens, I’ve started tothem doesn’t matter. For example, see Parallax animation becomelast year we launched an iOS app popular as well as gesture basedfor National Geographic - “National interfaces. I think gesture basedParks by National Geographic”.“ When it comes to ourwork, we embrace any te- “ Many of us here at Rally believe Web GL has a pro- mising future when it co-chnology or platform. ”What many people don’t realize is mes to web design. ” apps will continue to grow as userswhile it was only our 2nd encounter become more savvy with exploringdesigning and developing on the hidden UI’s. However, many of usiOS platform, it was actually the here at Rally believe Web GL has1st app we’ve ever built natively in a promising future when it comesObjective-C. The first iOS app we to web design. It will take yearsmade, “Canyon Country National but eventually HTML will beginParks”, was actually built using a to fade as the platform of choicenon-native iOS framework called for websites because it was neverCorona. When it comes to our meant to serve up rich media orwork, we embrace any technology interactive experiences in the firstor platform. place. Most hardcore programmers will probably agree that HTML andWhat animation techniques and CSS mark-up languages are noeffects applied to navigation and longer ideal to build on.user interaction will we see? Will Web Design Trends 2013 46
  47. 47. What do you think we’ll see in la- Can we predict an explosion ofyout and UI design in 2013? creativity in interaction and ani- mation now that the technologyI think 2013 will be a year of limbo is available and becoming morewhen it comes to [responsive] accessible from a web standardswebsites. They will continue to be point of view?wildly popular but will lack when itcomes to innovation and creativity. Most innovation with interactionMost of this won’t be the fault will be through Web GL and nativeof creatives or Agencies, rather apps. Unfortunately, the responsivewebsite timelines and budgets will era of websites will temporarily stiflebe stuck in the pre - fragmented some creativity on the web until alldevice era. Most timelines will be“ I think 2013 will be a yearof limbo when it comes to “ Most innovation with in- teraction will be through Web GL and native apps.[responsive] websites. They Unfortunately, the respon-will continue to be wildly sive era of websites willpopular but will lack when temporarily stifle some ”it comes to innovation and creativity.creativity. ”eaten up testing and optimizing browsers consistently support the newest technologies. If companiesrather than pushing innovation and want to push the boundaries ofcreativity. That being said, the native creativity in responsive design, theyapp world is wide open. Gesture will have to commit more time andand invisible UI’s will become more budget.popular and more intriguing whileWeb GL will [hopefully] start to besupported on mobile browsers,further pushing browser basedlayout possibilities. Web Design Trends 2013 47
  48. 48. Aarron WalterAuthor of “Designing for Emotion” “ We’ll begin to moveAarron Walter has been buildingwebsites professionally since 1999, andhas taught interactive design courses towards an era of flatat colleges. He enjoys sharing his ideas design that emphasizes ” legibility and usability.about education, findability, and designat conferences and organizationsaround the globe. Web Design Trends 2013 48
  49. 49. In technological and social ter- ms, how do you think the webwill evolve in the next few years? in the near future in web and mo- bile design? What do you think we’ll see in layout and UI design in 2013?We’re heading towards a Web ofloosely connected services. Instead In the short term future I see a trendof building a web app that needs towards an aesthetic that reflectsto do twenty things for customers, an honesty of our materials.we’re starting to focus just on The heavy use of lighting effects in interactive design will fade, and“ An ecosystem of connec-ted services makes buildingapps easier, and reduces designers will move towards flat, simple designs that no longer try to emulate the physical world. “the burden of content input The heavy use of lightingon the shoulders of users as effects in interactive designthey can reuse profiles and will fade, and designers willcontent. ”core workflows and rely on APIs, move towards flat, sim- ple designs that no longerintegrations, and hopefully web try to emulate the physical ”intents in the near future. We stitch world.together our favorite services usingIf This Then That, we pass photo We’ll stop shoe-horning interactionediting tasks over to Aviary, we let design into illustrated physicalDropbox hold our stuff then grab objects like books, radios, andit from desktop, web, and mobile calendars, and we’ll begin to moveapps. An ecosystem of connected towards an era of flat design thatservices makes building apps easier, emphasizes legibility and usability.and reduces the burden of contentinput on the shoulders of users asthey can reuse profiles and contentthey’ve created elsewhere.What trends do you see coming Web Design Trends 2013 49
  50. 50. What technologies are you tra-ining in now? Which disciplines What should the new designwill you be focusing on in the co- principles be in a future whereming months and years? web and mobile design must be focused on user experience andI’m not big on fetishizing content?technology. It empowers us tomake things, but what language, or I don’t know that they’ll be anytechniques power a site isn’t what different than they ever have been,moves people. They’re moved by but I think we’ll be more aware ofthe experience we create for them. principles now that our favoriteI’ll be thinking about what makes computers are in our pockets.people tick in the years to come The heuristics that have guidedso I can discover ways to create software design for years still applymore memorable experiences for to mobile design, but with limitedpeople. space on mobile devices, we’re forced to really consider the valueWhat should a web design new- of all elements and options in a UI.bie concentrate on learning? How do you think fast-growingLearn to prototype quickly. Learn to economies like India or China areuse things while you design them. going to influence the web andLearn to not look to trends in your mobile industry?“ In our industry and in life, I suspect India and China will provide a lot more developers tothe only thing that is un- the web industry, which are greatlychanging is change. ”medium for your inspiration, but needed right now. It’s really hard to hire skilled developers as there’s heavy competition for them in theinstead look at the history of other industry.crafts for insights. Learn to change,because in our industry and in life,the only thing that is unchanging ischange. Web Design Trends 2013 50
  51. 51. Trent WaltonFounder 1/3 of Paravel Inc. “ At Paravel, we’re fo-Trent Walton is founder and 1/3 ofParavel, a small web shop based out ofthe Texas Hill Country, where the lake cused on being as devi-levels are constant and the chicken ce-agnostic and reso-fried steaks are as big as your face. Dave lution independent as ”Rupert, Reagan Ray, and he have been possible.working together building for the websince 2002. Web Design Trends 2013 51
  52. 52. W hat trends do you see co- ming in the near future inweb and mobile design? in the coming months and years? At Paravel, we’re focused on being as device-agnostic and resolutionHopefully, as we progress we’llstop thinking about the the webin separate buckets. Words like “ We’re building responsi- ve sites exclusively and are using things like font iconstablet and mobile mean less andless as the lines between them and and SVG images whenever possible. ”“ The most exciting partof design is working to un-derstand all the devices out independent as possible. We’re building responsive sites exclusively and are using things like font icons and SVG images wheneverthere so that we can crea- possible. There are a lot of UIte a single, sensible design patterns that need to be rethoughtthat travels across as many to work in a responsive or multi-of those devices as possi- device environment, so that part of ” the work is particularly exciting toble. us.desktop browsing environmentsblur. For me, the most exciting partof design is working to understandall the devices out there so that wecan create a single, sensible designthat travels across as many of thosedevices as possible. That includesthings like maintaining hierarchyas well as optimizing for a range ofconnection speeds.What technologies are you/ yourteam training in now? Which dis-ciplines will you be focusing on Web Design Trends 2013 52
  53. 53. Oliver ReichensteinDesigner at iA Inc. “ I expect the app worldOliver Reichenstein studied Philosophyin Basel and Paris. He worked as brandconsultant for Interbrand Zintzmeyer and traditional WebLux for four years. In 2003, he moved design to get closer toge-to Tokyo where he founded his design ther in terms of functio- ”agency, Information Architects (iA). nality and aesthetics.Today, iA has offices in Tokyo, Zurichand Berlin. Web Design Trends 2013 53
  54. 54. W hat trends do you see co- ming in the near future inweb and mobile design? that within a foreseeable future, the main screen, Web designers will think about is the mobile phone.You can already see it happening. What should the new designMashable of the The Next Web, principles be in a future and bet web and mobile design must beon clean, generous, responsive focused on user experience anddesign with a lot of typographic content?care. I bet that a lot of corporateand news site are going to follow Simplicity. Scalability. Speed. Stopthat trend. The challenge will be thinking in fixed widths, platforms,“ browser versions, download speed Clean, generous, res- standards. Responsive design isponsive design with a lot of not just about responsive layouttypographic care. I bet that grids and clever ways of dealinga lot of corporate and news with big picture formats, it is also about a new dimension of screensites are going to follow typography.that trend. ”to find a good balance between Can you pinpoint any visual trends or design elements thatcleanness and density. With the might emerge in 2013?advent of responsive design thereis and entirely new set of screen I try to avoid thinking in termstypographical challenges waiting of surface aesthetics. Interfacefor us. After Web 1.0 aka the nineties design gets better the less youand Web 2.0 aka the 2000s, weare about to enter a third phasein Web Design. I expect the appworld and traditional Web design “ There will be another ge- neration of further visual ”to get closer together in terms of simplicity in UID.functionality and aesthetics. Withmobile platforms gaining more think in terms of style. But from theand more market share, it might be technical conditions it seems clear Web Design Trends 2013 54
  55. 55. that also aesthetically, there will be working on new interaction pattersanother generation of furthered for writing and reading on the screenvisual simplicity in UID. Microsoft and we are developing new framewent in that direction and might works to deal with the multitudessomewhat turn away from it in of screens and interaction patternsfurther iterations. I am prepared to that contemporary interactionsee the first traces of Ive shaping designers need to deal with. Ourthe surface of OSX and iOS, which tools are less and less specificwill definitely result in a simplified programs or programmingcleaner version of Apples surface languages. We start with research,design aesthetic. Hopefully, Ive will wireframes and initial mockups, butnot just simplify the surface design, we soon move towards working in prototypes that slowly evolve into“ Every trend comes with acounter trend, we can alsobe prepared for more baro- the final product. In technological and social ter- ms, how do you think the webque elements trying to set will evolve in the next few years?a counter point. ”but get to a simpler look and feel Just as with the new possibilities, Web technology, informationthrough a simpler interaction architecture, interaction design anddesign. Since every trend comes screen typography have becomewith a counter trend, we can also increasingly interesting, they havebe prepared for more baroque or become increasingly difficult. Weplayful elements trying to set a have to prepare for an increasinglycounter point. challenging technical setup. Right now there is a clear trend towardsWhat technologies are your teamtraining in now? Which discipli-nes will you be focusing on in the “ We have to prepare for an increasingly challengingcoming months and years?We are exploring the new screen technical setup ” a Web that is mostly handledtypographic territory, we are through a small touch screen. Web Design Trends 2013 55
  56. 56. I would not be surprised if, forexample, we end up with a tinydevice with a form factor of wristwatch that has a flexibility to fluidlymorph into a bigger device. Thuswith a device that in itself hashighly variable different screensizes. We witnessed the end ofthe fixed screen format,the end“ We witnessed the end ofthe fixed screen format,theend of the pixel, and theend of design principlesgeared by the desire of vi-sual control. ”of the pixel, and the end of designprinciples geared by the desire ofvisual control. In the mean time,the definition of these liquid designprinciples is far from clear. Thingsare going to stay exciting. Web Design Trends 2013 56
  57. 57. LegworkBy Sean Klassen “ Most innovation withLegwork was born from theunderstanding that you can build asustainable studio on the principles of interaction will be throu-creativity, innovation and a DIY ethic. gh Web GL and native apps. ” Web Design Trends 2013 57
  58. 58. W hat trends do you see co- ming in the near future inweb and mobile design? this industry, so the most important trait you can probably have is a passion for learning new things.I think we’re going to start seeing What technologies are your teammore exploration with 3d and training in now? Which discipli-immersive video. A lot of Flash sites nes will you be focusing on in thewe’re going down this direction coming months and years?5/6 years ago and then things wentback to much more basic layouts We want to keep pushing what youafter the iPhone came out. The can do with Javascript, CSS andtechnology is beginning to catch HTML. Additionally, we build mostup though. projects in Ruby on Rails these days. I’m curious about gettingAs an agency, what kind of profi- more into WebGL and other thingsles do you look for? like three.js to push the experience envelope further.Good people are hard to find andin great demand right now. We’re What animation techniques andactively looking for developers that effects applied to navigation andhave great javascript skills and still user interaction will we see? Willhave an eye for design (if you’re we finally move beyond Parallaxthat person, get in touch!). Since scroll?we are a small shop, we need I pray we move beyond the parallax“ We’re actively looking fordevelopers that have greatjavascript skills and still have scroll. It’s probably the most overused (in inappropriate ways) trend I’ve seen in the last ten years. ” There’s a time and place for it, butan eye for design. I’m so tired of seeing people do it just because they can. In mostpeople who are well versed in a cases the implementation andnumber of areas and aren’t afraid performance is really bad too. Youto jump around and try new things. can’t forget that the way somethingThings are constantly changing in works and feels is just as critical to Web Design Trends 2013 58
  59. 59. the design as the visual aspect, if become ever more important. It’snot more so. probably not long until mobile isAnyway, like I said above, I think the dominant form of browsing. Itwe’ll start seeing more and more also seems that people are getting“ I think we’ll start seeingmore and more with 3D.Hopefully people can keep “ People are getting away from skeumorphic styles that have dominated theit tasteful. ”with 3d. Hopefully people can keep last few years and are ins- tead opting for simpler, fla-it tasteful. We’ve also been doing alot with png sequences to emulatethings you used to only be able to tter styles. ” away from skeumorphic styles thatdo with video, but with the added have dominated the last few yearsbonus of transparency. and instead opting for simpler, flatter styles (think Windows 8,What do you think we’ll see in la- Svpply, etc.)yout and UI design in 2013?Simplicity, app-inspired design, Can we predict an explosion ofresponsive, single page websites, creativity in interaction and ani-alternative navigation patterns...? mation now that the technology is available and becoming moreSingle, long scrolling sites will accessible from a web standardsstill be popular. They’re great for point of view?“ Single, long scrolling sites Yes, to a point. IE8 isn’t going anywhere in the near futurewill still be popular. They’re though and it’s really just as bad atgreat for telling a singular supporting these new technologiesstory. ”telling a singular story. Responsive as 7. So, a lot will depend on the audience you have to target.sites and mobile targeting will Web Design Trends 2013 59
  60. 60. UltranoirDigital Savoir-Faire, most awarded studio on Awwwards “You will have fast andUltranoir is a human-sized studio drivenby passion. Their byword is ‘usefuldesign’, since they believe that the role easy access to whatof artwork is to serve the application, you’re looking for butits objectives and the end-user - not with creativity, style and ”the other way around. Ultranoir has even emotion!received numerous awards for its onlinecreations. Web Design Trends 2013 60