In Design for the Web, we were tasked with creating a website for a travel destination from “52 Places to Go in 2018,” a travel directory from the New York Times. I selected Gansu, China. We began by analyzing the information highlighted in the article and doing research. I then evaluated the target audience, created mock user personas, and created a mood board.
After mapping out the site layout and designing styles tiles to establish visual styles, a color scheme, and font styling, hand-drawn desktop and mobile wireframes were made, which were than translated into low-fidelity — and then high-fidelity — wireframes in Adobe Illustrator. The hi-fi wireframes were then imported into InVision, where I created an interactive prototype.
Finally, I began the HTML and CSS from scratch, recreating but also tweaking my previous designs, and using jQuery to create a responsive layout that can be viewed across varying screens and browsers.
My process is documented below.
TOOLS:
Adobe Illustrator
InVision
Brackets
HTML
CSS
Media Query
Google Fonts
Fetch
User Personas
Mood Board
