Deconstrukt #9: New Folio For The-Artery. A Future Classic

Attention to detail, wow factor and a timeless design approach make the new site by The-Artery a must study for anyone interested in mastering digital couture.

Everything about this site tells the story of a multi-disciplinary design team grounded in time honored principles. Take the very first 3D model that greets the user. Against a sea of minimalist black and underpinned by a responsive grid, our eyes are drawn to the center of the screen as a commanding sculpture of Hercules spins and pulses. Accompanied by a brass orb and wireframe, with multiple light sources, our historic hero’s right shoulder explodes and retracts to reveal the 3D polygon structure underneath.

On the surface this element looks pretty damn cool. Under the surface however there are multiple connotations at work that instil a sense of grandness and strength. Grandness that equals premium quality in the minds of visiting clients and strength to imbue a sense of trust.

To help users move on from being transfixed by Hercules, The-Artery team have added the word “SCROLL” with a line animation at the left of screen plus a bouncing down arrow to the right. Both of these not only improve the UX dramatically, they visually balance the logo and menu graphics above them. Just above the bouncing arrow sits the words “01 Visual Effects” in large type to add page hierarchy while the designer has chosen to move this title down-screen just a tad. There is a thinker at work here.

So we scroll. Instead of the usual micro-second of discomfort that comes when preparing for content, we are met with another central hero character. Thankfully there’s no need to fuss with the mouse wheel to line up the content thanks to “scroll locking” smoothly providing the perfect landing position on the page. Love it when des/devs do that…

See the rest of the deconstruction here on the CSSDA Blog.

CSS Design Awards: Be inspired. Be inspiring.