Case Study

Creative Machine Website

OVERVIEW

Based in Wellington, Creative Machine specialises in producing high end concepts and content using motion and photography - sometimes separately,
often together. This is useful for social media, TV and advertising campaigns - throughout New Zealand - or anywhere you like.

INFO

Client: Dean Zillwood

Role: Web &UX Design, Web Development

Year: 2018

RESULTS & OUTCOMES

• Create a portfolio website that reflected Dean's photographic style;
• An uncluttered clean user interface;
• A developed web aesthetic that fits in with the brand;
• Adapt a new design to the logo styl;e

Visual Concepts

Creating visual concepts was necessary to clear out the right design vision I need to keep up with. So I conducted research, and I provided the client with a few options
to choose the one he liked. I also considered the client’s preferences and brief during the research.

Architecture

Mind mapping is the next essential step that we took during the website redesign. A mind map helped us build the website's informational structure, prioritize the
hierarchy of elements, and understand the whole functionality of the website.

UX & Wireframe Layout

I created wireframes for the various screens to better understand the page structure, hierarchy and layout on individual interface elements. The great thing about wireframes
and prototyping is you can see where user flows feel unintuitive.

Typography

Typography is an important part of the visual style of the future interface. Therefore, it is important to pick a font pair that will convey the mood and emotion of this site
to users. I used Brothers for the headings, navigation and Merriweather for the body text.

Site Pages

Once wireframes were created and approved, I proceeded to the building of clickable prototypes and tested them. Then it was the turn of the UI stage. I faced the next challenging
but interesting task during this stage — building a visual layout and responsive design that will be adapted to smartphones and tablets.

Web Design & Development

The website pages was created with a responsive Framework, HTML5/CSS3, Jquery. Throughout the website development thourough browser and device testing was employed to ensure a
responsive website that works on desktop, smartphones and tablets.