Sourcebits Blog

Next Gen Trends in Web UX/UI

Breezing into summer we’ve seen some pretty thorough roundups of the latest Web and UI design trends.  Horizontal scrolling enjoys it’s day in the sun, while Web fonts and online typography have gotten huge this year.  Unabashed design geeks ourselves, we’re always in the thick of what’s new, but in order to make fantastic pages for our partners looking two steps ahead is a must.  So let’s go to the source: the online homes of the designers themselves – many of whom work right here.

One Screenful at a Time, Please

One of our senior interface designers, Na Wong, fronts with strong shapes and bold, form-filling graphics.  Top and bottom nav bars frame the main window while inset vertical text on the left provides a subtle anchor for the dynamic content.  A muted background with soft noise draws the eye to the colorful featured work.

Another Sourcebits UI designer, Austria-based Philipp Antoni, takes the same strong centered rectangle tack but with multiple layers and vertical text navigation on the left.  As with Na’s design, featured graphical content leaps out from the main window set against a neutral background.

Lou Mantia’s site takes a stark, minimal approach along the same lines, with a massive centered rectangle on white and discrete text-based top nav.  Big, bright, saturated graphics instantly draw the eye, and note the logotype fill changing dynamically with the featured content.  A simple, yet awesomely creative touch.

Though not a designer’s page, the site for this year’s Iconfest (which we can’t wait for) takes a similarly minimal, rectangular route, with baby blue Bookman out front.

We also have Miles Ponson’s Californian Design, eschewing nav bars altogether and going with another recent UI meme: iPhone page indicators as clickable nav buttons.  And these – it must be said – do not port well to mouse-based interfaces.  If you’re using them for anything other than page indicators, please stop.  Now.

Also worth noting is Jonas Rask’s vertical rectangle, and on the non-rectangle front, we have another Sourcebits user interface designer, Edward Scherf, with speak-for-themselves 512×512 icons in distinctive bold shapes front and center.

David Lanham takes a gallery approach with a dusky, textured background and vibrant, almost glowing colors drawing the eye to four content-filled frames.

And finally, iconpaper.org features bold, black-framed squares on a 3×3 grid with bright, beautiful thumbs that simply leap from the page.  At the top of the grid you’ll find a minimal nav bar consisting of a few well-designed, glyph-like icons, and down at the bottom note the large, clearly purposed horizontal slider that keeps your eyes comfortably pinned to the single, gorgeous screenful of content.

Chunky

Chunking information into parcels of easily consumed content is nothing new, and at the ‘screenful’ level clearly works for showcasing a design portfolio.  But why stop there?  Anything that can be browsed is a candidate for chunking into screenfuls.  Online retail, text-heavy news and blog sites, rich media content – the top designers are already re-imagining the next generation of user experiences.

And Sourcebits has the best.  Yes, hands down, the best interface designers in the industry – several of them highlighted right here on this page.  Their passion for interface design is matched only by the laser guided Art direction of our own Apple Design Award winner Piotr Gajos.

Piotr and the design team, together with our squad of technophile engineers and programmers spend each and every day building stunning, intuitive interfaces for everyone from small app shops to Fortune 500 companies like GE and Coca Cola.  Check out some of our client pages below:

Companion site to Knocking Live Video, the best-selling app for iPhone and Android.

The Spoonjuice page, with dynamic top nav bar and main window content, incredibly intuitive and space-efficient.

Microsite for voice actor Kevin Doherty.  Hidden within the minimal interface are a custom mp3 player and smooth jQuery slide effects.

Drop us a line.  Let’s talk about the design of your next project.