Deliverable

Website Redesign

Position

UI/UX Designer

Duration

Jan ’14 – Feb ’14

Cloud City Development

Homepage Header

Objective The Cloud City Development website is the business portal for this San Francisco-based software design and development agency. It needs to describe the type of work they do, how they do it, and what projects and clients they have previously worked with. The overall feel of the website needs to be engaging and display a sense of expertise, engineering, design, and a pleasant customer experience. In addition to this, it needs to provide access to their blog, social media presence, and information about events that they are involved with.

I was asked to redesign this four-page website using the established brand identity, typefaces, and color scheme, and the written content provided. The goal was to update the website design using current best practices, and to re-establish a cohesive, unified visual design and navigation.

Design The re-design of this website focused on creating a visual design that was simple, precise, and friendly, in order to convey the sense of expertise, design, and engineering. The majority of content is written rather than visual, so it was essential to design a hierarchical type system and a layout that structured the content in easy-to-read chunks with several visual entrances into the text. To complement the limited selection of graphics, ample white space was used to keep the text from feeling overwhelming.

A white and gray color scheme, with small pops of orange and bright blue, kept the website feeling clean, professional, and friendly, and matched the Cloud City Development logo. The homepage hero image keeps to that color scheme, depicting a close up of the Golden Gate bridge and bright blue sky. This image shows off the precise angles, rivets, and cables that make the bridge such a beautiful feat of engineering, making it an appropriate metaphor for the work that Cloud City Development does. Additionally, it is an attention-getting image that brings a lot of visual punch to the homepage.


View it live at www.cloudcity.io
Homepage
Blog