Satellite Voices – enticing design, engaging UX

Have a squiz at this elegant piece of work. handiwork of London outfit Dazed Digital (they call themselves an Ideas Sharing network), Satellite Voices is an arts website teeming with content from around the world.

Design notes

We love this versatile design that can change daily and never seem dull. The background image stays in place as the site contents scroll. The site header and footer also don’t scroll which means the site navigation is always available and there’s no need to give your mouse scroll wheel a big workout. Individual articles are all different shapes and sizes and this keeps the design interesting.

User Experience (UX) notes

This site represents a great discovery-oriented user experience. Instead of using complex navigation hierarchies, content is discovered by simply scrolling. A limited number of articles are loaded at first and another page worth are loaded with AJAX as soon as you scroll to the bottom of the page.

Faceted filtering is used in the navigation to allow the user to easily filter all content by location and topic. Content reloads with AJAX very quickly, and the URL is updated dynamically to represent the change in the user’s selection. These URLs are both search engine and human bookmarking friendly.

Technology notes

The site uses jQuery Masonry to allow automatic placement of odd shaped UI elements. Masonry is a dynamic grid layout plugin for jQuery. Shunning the default float behaviour of laying out elements first horizontally then vertically, Masonry places elements by finding the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

Satellite Voices home page

Worth considering this architecture if you have lots of text+visual content

Satellite Voices article

Articles load on a layer on top of the home page

How do you rate this?

Add New Comments