Be The First To Know

Welcome aboard! We are thrilled to have you.
Uh oh, something went wrong. Try submitting the form again.
Video Content

How to Design a Website From Wireframes

In this video, Chris provides feedback and art direction to designer Sharleen Chen. Sharleen is working on a client website for Ole’s Hakai Pass Salmon Fishing Lodge. We see her transform the wireframe into different iterations of the visual design before seeing the final site.

Wireframing is an essential step in the UX/UI design process. Designers plan for and lay out the content structure and get a feel for the function of the site. They map the information architecture, and figure out where to place the most important pieces of content for site visitors.

When it comes to both wireframing and designing a website, the goals and needs of the end user need to be accounted for through every step of the process. In this case with Ole’s Hakai Pass Fishing Lodge, the end user is likely visiting the site to learn more about the fishing lodge, check availability, and make arrangements for a future trip.

Each component of the website needs to anticipate the ideal, target user and what they’d need once they land on the homepage.

It’s important that the visual design reflects the brand identity of the Fishing Lodge, and helps the user get a feel for the experience if they were to book a trip there. The typeface, color palette, textures, imagery, and copy all have to work together to communicate this. The goal is to get the user to connect with the brand in some way, and feel confident to make a reservation.

For more on the art direction and progress of this website design, check out the video above to see how Chris and Sharleen collaborate on this project.

How to Design a Website From Wireframes

Please fill in the form below to download How to Design a Website From Wireframes. It will be in your inbox shortly after.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

This form collects your name and email so we can add you to our email list and send you our newsletter full of helpful insights and updates. Read our privacy policy to understand how we protect and manage your data.

How to Design a Website From Wireframes

How do you go from wireframes to the final visual design?

How do you go from wireframes to the final visual design?

In this video, Chris provides feedback and art direction to designer Sharleen Chen. Sharleen is working on a client website for Ole’s Hakai Pass Salmon Fishing Lodge. We see her transform the wireframe into different iterations of the visual design before seeing the final site.

Wireframing is an essential step in the UX/UI design process. Designers plan for and lay out the content structure and get a feel for the function of the site. They map the information architecture, and figure out where to place the most important pieces of content for site visitors.

When it comes to both wireframing and designing a website, the goals and needs of the end user need to be accounted for through every step of the process. In this case with Ole’s Hakai Pass Fishing Lodge, the end user is likely visiting the site to learn more about the fishing lodge, check availability, and make arrangements for a future trip.

Each component of the website needs to anticipate the ideal, target user and what they’d need once they land on the homepage.

It’s important that the visual design reflects the brand identity of the Fishing Lodge, and helps the user get a feel for the experience if they were to book a trip there. The typeface, color palette, textures, imagery, and copy all have to work together to communicate this. The goal is to get the user to connect with the brand in some way, and feel confident to make a reservation.

For more on the art direction and progress of this website design, check out the video above to see how Chris and Sharleen collaborate on this project.

Sign up for the Conversational Selling Workshop in London here.

Watch on
Episode Links
Hosted By
special guest
produced by
edited by
music by
Appearances
recommended reading
No items found.

Video