Process

Where process meets creativity,
you get smart designs.

Discovery

This initial stage of the design process is where I learn about the client and their user’s needs. It includes a client survey, which analyzes the client, their industry and the project scope. Also, technical and functional specifications are investigated. And a user profile is created to determine their demographics, informational needs and technical capabilities.

Information gathered from the these analyses are used to formulate the site objectives. A card sorting study helps define the information architecture (IA) which is the site’s navigation. This provides a structure that enables the user to easily locate the information they are seeking and results in a positive user experience.

Client Survey thumbnail
User Profile thumbnail
Information Architecture thumbnail

Design

From the discovery stage I move to design. Here I take the IA and begin building the framework or wireframes. This is usually done in Adobe Illustrator. You can compare it to a blueprint of a house. It’s done in grey scale and shows the layout of each page. If it is a responsive site, I’ll include tablet and mobile versions as the layout changes depending on the size of the device.

The next step is to work on the visual designs, which are static pages with the look and feel of the site. If branding is needed I work with the client and incorporate this into the design. This could include designing or redesigning a logo. A color palette is researched and created. I use the wireframes to create the visual designs, adding color, slideshow & static images and headings and subheadings for each page. This also includes responsive layouts for desktop, tablet and mobile devices.

Wireframe Desktop thumbnail
Wireframe Tablet thumbnail
Wireframe Mobile thumbnail

Develop

The final stage in my workflow process is development. Here I begin coding the site. I can use a host of authoring tools like Aptana Studio, Dreamweaver, and Text Wrangler for coding. The technologies I use are HTML5, CSS3, JavaScript, jQuery, PHP and LESS. I have developed sites by hand-coding and using WordPress and Twitter Bootstrap.

Like the other stages this requires problem solving skills. I take into consideration the different browsers and versions, operating systems, and the many devices the website will be viewed from. Search engine optimization (SEO) is the process of affecting the visibility of a website or a web page in a search engine's search results. I implement HTML meta data to increase the site’s SEO. Lastly, after a lot of testing and the site is fully functioning, I launch the site. This is where the true beauty lies. It’s a joy to develop a website from start to finish and see it live on the web.

Coding thumbnail
SEO thumbnail
Process 3 thumb