Alex Read UX/UI and Front-End Developer

Cosmic Atlas

Web design & development
Cosmic Atlas homepage

A digital guide to astronomy, Cosmic Atlas is an interactive, informative website.

Vscene

UX/UI design
Vscene homepage

Redesigning the web-based videoconferencing service Vscene.

Sound Waves of Music

Data visualisation
Sound Waves of Music data visualisation

A data visulisation project about one of my personal passions, music.

Pet Project

Marketing posters
A poster: 'A catless house is a soulless house.'

A project to create a 360° campaign encouraging a wide audience to adopt pets.

Cosmic Atlas

The three parts of Cosmic Atlas: Timeline of Everything, Map of the Solar System, Discover in Depth.

Cosmic Atlas is an interactive guide to astronomy.

It was born from my personal love of all things astronomical, and aims to inform the user of some of the subjects I find most fascinating about space.

The three sections offer real depth of knowledge, presented graphically.

Design

Structure, navigation, and graphic design.

The eight planets

With Cosmic Atlas, I tried to subvert the expected visual style of a space website by using a wide pallette of strong colours.

Code

Built from the ground up in HTML, CSS, and jQuery.

Cosmic Atlas jQuery code

HTML structures the site, CSS styles it and provides animations. jQuery allows the page to respond to users' interactions.

Content

Created to spread my personal passion for astronomy.

Cosmic Atlas' page on the Space Race

Cosmic Atlas' text was all researched and written by myself, the collation of two decades' astronomical facts that I'd collected.

Vscene

Vscene Community homepage design

In my year at Jisc Technologies, I was tasked with redesigning the user interface and experience of Jisc's videoconferencing service, Vscene. I also created the basis of a social network for Jisc's partner, Ajenta.

The constraints of working on Vscene were a double-edged sword: while working within a strict style guided my designs well, it was also very limiting in the design elements that I could use.

Making Ajenta Hub allowed me more freedom in the layout, though I think some more styling could really improve the images.

User Interface

Designed with the user in mind.

The control panel for a Vscene virtual room.

Starting from the existing, poorly-optimised web pages, I tore each one up and laid it out again according to UI/UX principles.

User Experience

Red routes and user flow.

Vscene navigation diagram

The whole online experience was mapped out to better understand and recreate how the user got what they wanted from the site.

Mobile

Compact design.

Mobile designs for Ajenta Hub

Both Vscene and Ajenta Hub were made for mobile as well. It was a great exercise in displaying vital information and options in a limited space, a crucial skill on today's web.

Sound Waves of Music

Sound Waves of Music infographic

The Sound Waves of Music infographic visualises the popularity of different music genres throughout time.

Each bar shows how many songs from each genre made it into the top 5 of the Billboard singles chart for that year.

Ideation

Finding my topic.

Rough ideas and mind mapping.

The idea for this data visualisation came from mind mapping everything that I've ever been interested in that could be displayed numerically.

I also considered sports, video game history, and Harry Potter, but once I'd hit upon the 'sound waves' display, it could only be music.

Design

Showing the data effectively.

Cosmic Atlas homepage

A wide range of colours on a neutral background allow for strong colour coding, and for the viewer's eye to follow the horizontal coloured bar for each genre.

I played with the idea of displaying individual subgenres on the chart, but rejected it for being needlessly detailed: simplicity and clarity was more important.

Creation

The detail.

Cosmic Atlas homepage

Parts of the infographic were added to make it as easy as possible to read, like subtle vertical lines and decade labels to help compare genres by year.

Pet Project

A poster about how great cats are: 'A catless house is a soulless house.'

The aim of this project was to create a 360° campaign that encourages people to adopt pets. I made three posters, each featuring different animals to appeal to a wide audience.

These would be placed around public transport, vet surgeries, community centres, and retirement homes, to target adults with the means to support a pet.

Design

With the audience in mind.

Poster: 'My Pets Complete My Family'

The posters use colour theory to convey the best parts of owning a pet: bright and natural for the outdoors side of owning a dog, warm and cozy for the cat.

Versatility

For use anywhere.

Alternate versions of pet posters.

Three different versions were made for each poster: portrait, landscape, and banner-size, to allow it to be used in any scenario.

Animation

For a modern setting.

Cosmic Atlas homepage

Because motions captures the eye like nothing else, I made animation keyframes to show how the posters could look on electronic screens.

Like what I do?
Oh, thank you.

Give me a shout:


I'm on LinkedIn too