7 steps of web design process
A simplified step guide by Lukas Rudrof
Luka Rudrof is an experienced product designer based in Nuremberg, Germany with a passion for user interfaces and web design. His planning for a new project is quite similar to the one I carry out in my day to day and we both agree that great design is actually about having a website creation process that aligns with an overarching strategy.
01_Goal identification
The initial stage is all about understanding how you can help your client.
Who is the site for?
What do the expect to find or do there?
Does the website need to convey a brand’s core message or is it part of a wider branding strategy?
What competitor sites are there?
02_Scope definition
A chart which details a realistic timeline for the project, including any major landmarks, can help to set boundaries and achievable deadlines.
Provides an invaluable reference for designer and client
Helps keeping focus
Helps to negotiate when the project expand or evolve
03_Sitemap/wireframe
It helps give web designers a clear idea of the website’s information architecture and explains the relationships between the various pages and content elements. Possible tools:
Pencil & paper (the basics :)
Axure
Webflow
Sketch
Adobe XD
04_Content creation
Content serves two essential purposes:
Engagement and action
Content engages readers and drives them to take action. By breaking large test blocks up into short paragraphs supported by visuals can help to keep a light, engaging feelSEO
Content also boots a site’s visibility for search engines. Content that’s well-written, informative, and keyword-rich is more easily picked up by search engines, all of which helps to make the site easier to find.
05_Visual elements
This phase will often be shaped by existing branding elements, color choices, and logos, as stipulated by the client.
But the designer can shape a lot in this phase too. Important for this stage:
High-quality images/graphics
Moodboards, style tiles, element collages
Visual style guides
06_Testing
Once the site has all its visuals and content, It is ready for testing. Important here is:
Does the website display correct on all devices and browsers?
Are all links working?
Proper meta tittles and descriptions?
Loading performance of the website?
07_Launch
When everything has been thoroughly tested, It’s time to launch.
Some elements maybe still need fixing. Web design is a fluid and ongoing process that requires constant maintenance. This includes:
User testing
New content or features
Monitoring analytics
You can take a look at Luka Rudrof’s portfolio here
