Project Detail
Washington State Website
Project Overview
This project was created for a Front-End Web Development course at Western Governors University. The goal was to develop a fully responsive website with a homepage and individual pages for three cities.
I designed, structured, and coded every part of the site by hand, incorporating accessibility, user experience, and visual design principles.
The project received an Excellence Award for its clean design, responsiveness, and attention to detail.
My Role
- Wrote semantic HTML for all pages
- Designed layout and color scheme
- Created navigation and a consistent structure
- Styled responsive components using CSS Flexbox and Grid
- Implemented accessible color contrast and scalable typography
From Figma to Code
Before writing a single line of code, I began by wireframing the homepage and supporting pages in Figma to establish layout, content hierarchy, and responsive behavior. This planning phase helped clarify the user experience and set a strong foundation for development. The final coded site closely follows the wireframes, with refinements made during the build process to improve readability and interaction on both desktop and mobile.
Initial Wireframes
Final Wireframes
Responsive Website - Final Build
Below are views of the final website, built entirely from scratch using semantic HTML, CSS, and JavaScript. The design brings the original Figma wireframes to life with a clean, responsive layout and accessible structure.
Tools Used
Live Site + GitHub
Interior Pages
Recognition
“Your Washington-state website embodies professional-grade front-end development: clean, semantic HTML; elegant, responsive CSS that brings subtle hover flourishes and precise positioning to life; and thoughtful JavaScript validation that anticipates user needs. The consistent navigation, accessible imagery, and well-researched city content show you kept real visitors front-of-mind, transforming a checklist of requirements into a cohesive, engaging experience. That blend of technical rigor and user-centered storytelling sets outstanding work apart and speaks volumes about your creativity, discipline, and attention to detail. You should be proud, as this project is a resume-worthy showcase of your skills and clear evidence that you can turn vision into a polished reality. Great job!”
Course Instructor, D277 · Western Governors University
Reflection
This project strengthened my ability to plan site structure, implement responsive design, and refine layout decisions with usability and accessibility in mind. The recognition it received reinforced my interest in front-end development and gave me even more confidence in combining visual design with hands-on implementation.