Website · Independent work · Website design and front-end
Visual design and front-end for a website
From positioning, structure and copy to visual design and front-end code, delivered as a responsive, production-ready website.
- Independent work · Positioning, structure, copy, visual and front-end
- Complete pages · Responsive · Chinese and English
- Design and code delivered together
01
Goal
An independent designer's site has to answer three things first: what you do, what you have done, and how to reach you. A client should finish the home page knowing what to commission, having seen the evidence, and knowing the next step.
02
My role
Positioning and copy, information architecture, visual design and front-end implementation, all by me. The page you are reading is the result itself.
03
Key decisions
Structure follows reading order. The home page keeps the first screen, the work, short entries to process and about, and contact. Work, case pages, process and about are pages of their own, and the navigation has four items. An even grid, complete covers. The six cases share one component in a two-by-three grid, every cover shown whole at 16:9, with titles and descriptions of neighbouring cards aligned, and a single column on phones. Adapt each language rather than translate. Chinese and English are written separately with their own addresses, switching stays on the same page, and headlines set line height and spacing per language.
04
Visible result
A complete website: home, the work list and six case pages, process, about and contact, browsing smoothly on phones and desktops with clear navigation and both languages complete. Every interactive element can be reached by keyboard with a visible focus ring, and motion respects the system reduced-motion setting. Design and code are delivered together.
Want something similar?
Send the goal, the expected deliverable and references, and I will reply with a scope note.
