Every week at Fueled, our London-based Creative Director, Rob Palmer, shares a handful of inspirational websites with our teams in New York, Los Angeles, and Chicago. This weekly email acts as a virtual water cooler, encouraging us to congregate across time zones and discuss what brands and blogs are doing to push new trends in web design.

The Divergent Series

The Divergent Series is exceptional in its outstanding web design. With swift horizontal and vertical movements, all transitions on the site are neat and orderly. The navigation bar sits along the bottom of the screen, and you can either skip ahead, or allow the smooth page movements to progress on their own. Each new page slides into view from the right side of the screen, the way you would turn a page in a book, and the parallax effect coupled with the horizontal movement gives the page great dimension. As the text slides into view from right to left, a crisp white line creates a square around it. With sound clips in the background mentioning “walls” this visual feature complements the auditory experience for the viewer.

The Divergent Series

Epic Ireland

Epic Ireland is a website designed to illustrate the unique history of the Irish culture. Reminiscent of a timeline, a sleek yellow stripe stretches across the screen on the homepage, and as each background photo loads, the faded color of the line becomes solid - similar to the way a progress bar on a video loads. In this way, it acts as a guideline for the viewer. Each page transition is linear in movement, and there are a number of special features that make the website unique. For example, when transitioning to the Experience page, the horizontal timeline rotates vertically and takes on a soft curvy shape. It looks like a path that your eye is meant to follow down the page.

Epic Ireland

The Law of The Jungle

The Law of The Jungle, a site dedicated to the movie The Jungle Book, is impressive in its web design. The first page has no scrolling feature which allows everything above the fold to stay in view the entire time. At the center of the page are bold white letters that sit just above a rotating circle. When hovering your mouse over the rotating circle, it vibrates - somewhat mesmerizing - and looks like a slice from a tree trunk. The transition between pages is smooth, and there is a feeling of continuity as each new image gently slides from right to left on the screen. The navigation bar that sits on the left side of the page is minimalist in design with small square icons, and on hover each one transforms into a simple line.

The Law of The Jungle

Grain and Mortar

Grain and Mortar, a strategy and design agency, has a simple and sleek design to their site. An artsy video plays on the homepage, and just above the fold sits half of the brand’s logo. The slightly unfinished element to the logo instills a feeling of curiosity in the viewer to scroll farther down on the page. There are a number of small details that add to the website’s simple design, such as the three-dotted hamburger menu swapping to negative colors when scrolling down on the page. Overall, this site’s font, color-scheme, and simple features give it a very straightforward and user-friendly feeling.

Grain and Mortar

Tedx Portland

Tedx Portland is clean and simple in design, and most of the website is colored in sleek black and white. When first scrolling on the page, the parallax effect adds a sense of dimension to the site. The navigation bar sits horizontally at the top of the screen and also acts as a timeline; as you scroll, the nav bar represents your regression in time, and each year is illuminated to a bright red hue. On hover, each video clip on the screen fades to a darker shade, as the title is highlighted to the same red color. Overall, this site is simple, neat, and very user friendly.

Tedx Portland

Camper

Camper’s site is innovative with cool, unique features. The homepage is laid out in a grid with a bright green map of Mallorca at the center. Everything on the screen appears above the fold, creating a completely static page. Though you can not scroll, animation and movement are given to the site in a different way. When hovering over the individual images on the grid, they move and come to life - the same way a GIF does. Transitions between screens are linear in movement: it looks as though someone has made a clean cut down the center of the page, as each half slides to their respective side. The movement is similar to two sliding doors opening and closing. When hovering over more images, text appears that is reminiscent of groovy 60s bubble font, and it bounces around on the screen with the movement of your cursor. The smartphone that appears at the bottom of the page is the most fun part of all. When clicking on it, the phone shifts to the center of the page and it seems as though you’re taking a selfie. In this way, you are connected to the screen, and the interactive experience leaves you feeling interested and excited about their product.

Camper