Part 6 of the design process

Present your design

Marketing and panache are needed to sell your idea to others.

Find out more

How to present

Deciding what to show and when

Sketches, photographs, sound-bites, wire-frames and mock-ups were carefully documented through the design process. This makes the process of presentation extremely easy as the design narrative can be threaded through artifacts of choice. I decided to present the process in a step by step approach as to afford importance on the way I work, giving heft to every step as opposed to focusing on the solution. Although there is quantity, hopefully you agree there is quality too. Removing a step of the process would be a untrue example of the way I work.

Tools used

HTML, CSS and JS

This site relies on Bootstrap for a lot of the CSS elements allowing for quicker production times.

Sketch

Where I do the bulk of my design work nowadays, speedy, crisp and with a myriad of plugins for quickening the process.

Invision and Craft

Used for rapid prototyping of flat sketch files, craft allows for quick syncing and dummy data use.

Illustrator and Photoshop

Still useful for editing SVGs and bitmap images when Sketch isn't powerful enough.

Resources

Bootstrap

This site relies on Bootstrap for a lot of the CSS elements allowing for quicker production times.

Github and Netlify

Built in a github pages repo which allows for code management and hosting, whilst Netlify allowed password protection if needed.

FlatIcon

Free resource where most icons used on this site were found.

Pexels

Free resource of images used for some of the images.

Important factors in presentation

Stick to the brand

From selecting the right fonts, Roboto and Debby, to the right colors, images and button styles. This creates a consistent and recognizable experience between the UI and this micro site. Also decreases production/design time.

Design for mobile

This site is fully responsive and optimized for mobile and tablet use. Using the bootstrap grid makes this process extremely simple.

Tell a story

Arrangement of the site has been designed to tell a story of the design process, split into chapters which have a chronological order. You can of course skip straight to the results if you wish..

Up next

The design process is finished

See the results of the task and explanations on how they solve the brief

See result