image

idnworld:

IdN v20n3: Music Graphic Issue – Is there still a role for designers in the music world?

The music industry is facing a major disconnect with its visual heritage as listeners switch to digital downloading. But some designers are hanging in there — they tell us why and how.

http://idnworld.com/mags/?id=v20n3

idnworld:

IdN v20n3: Music Graphic Issue – Is there still a role for designers in the music world?

The music industry is facing a major disconnect with its visual heritage as listeners switch to digital downloading. But some designers are hanging in there — they tell us why and how.

http://idnworld.com/mags/?id=v20n3

Comments – 7/31/2013

text

5 Beautiful Examples of Responsive and Responsible Websites

At the moment, responsive web design is all the rage. More and more websites are designed responsively from the start, but how many are responsible?

A responsible website should respond well to the context of the user’s device. Screen size, device specific functionalities, data network limitation, etc. should be taken under consideration while designing responsible websites.

Let’s take a look at some responsive websites that I think are also responsible.

1. Smashing Magazine

smashingmagazine.com

image

Smashing Mag’s most impressive responsible feature has gotta be its navigation. There is a lot of content on the site so browsing through could be a real pain if the information architecture is handled poorly. But luckily for us devoted readers of the blog, Smashing Mag pays close attention to the design of the navigation down to every breakpoint. Stretch your browser on desktop and see how the navigation transforms. It’s a thing of beauty.

2. Quartz

qz.com

image

Quartz is one of those news site that will scroll endlessly. On mobile, the readers are able to casually browse through article titles and press on the ones they want to read. On larger devices, Quartz provides a more in-depth browsing by showing full articles while still keeping a list of article titles for casual browsing on the sidebar. This is a great example of progressive enhancement.

3. sketchin

www.sketchin.ch

image

This Swiss ux design studio takes advantage of larger and more powerful devices by featuring a full screen video as their site’s focus area while reducing it to a still image for mobile.

4. Luke Finch

welovenoise.com

image

The UK designer based out of Manchester has fun showcasing his portfolio. Luke features a big canvas on his home page that lays out thumbnails of his projects. On desktop, the canvas moves along with the mouse; on tablet, the user can drag the canvas around; on mobile, the thumbnails become a straight list vertically. Using certain device specific functionalities, Luke creates different yet fun and intuitive user experience across different devices.

5. Sick Designer

sickdesigner.com

image

Just like the title, this site is sick! I know flat design is in and skeumorphism is out now, but you can’t deny how beautiful this site is. On mobile, the focus is just on the content; on bigger devices, the user is able to view all the bells and whistles (a beautifully illustrated wood deck with accessories), including an animated working watch!

Honorable Mentions

Comments – 5/30/2013

image

mikeloveschina:

New skin for this blog.

Check out my other blog where I share traditional and contemporary art from China.

mikeloveschina:

New skin for this blog.

Check out my other blog where I share traditional and contemporary art from China.

Comments – 5/12/2013

image

Listen / Play / Watch posters for Xbox creative studio
(via Behance)

Listen / Play / Watch posters for Xbox creative studio

(via Behance)

Comments – 5/10/2013

image

Album Cover: Leo Ku - Hopscotch

Album Cover: Leo Ku - Hopscotch

Comments – 5/06/2013

image

Album Cover: Danny Summer - I Remember…

Album Cover: Danny Summer - I Remember…

Comments – 5/05/2013

image

Poster for Tai Chi Live Concert in Hong Kong

Poster for Tai Chi Live Concert in Hong Kong

Comments – 5/04/2013