A website design, where we have merged two websites into one, which allows risk assessment for educational professionals, providing online courses integrated into the E-Commerce system.
kinderleichter-arbeitschutz.de
My role
- UX research
- Competitors analyses
- Sitemap creation
- High-fidelity clickable Prototypes
- Usability Testing
The team
- CEO & Management
- Frontend & Backend Developers
- Product Management
Deliverables
- User Flow Optimisation
- Mock-ups
- Prototypes
- Design Language Creation
- Polishing Design
Sitemap
After conducting a card sorting method, a Sitemap has been established from gathering all the important pages from both of the websites that have been merged and also creating some new ones to enhance the user experience.
We have started designing more precisely the sections to align better with the Client’s expectations
This method has been proven from our experience so far as a great one, avoiding unnecessary work that often happened before engaging in this practice.
Mid-fidelity prototypes
Few examples:
Slider creation (high fidelity)
I have created a slider for each of the main categories, with a corresponding colour that represents them. This made the client very pleased.
Mega-menu creation
After agreeing on a centred logo positioning on the website with the client, I needed to add an appropriate mega-menu:
The mobile-first design of the pages
Excluding the slider, which I provided immediately on a desktop view, the rest I have used the mobile-first approach, exercising the best practices in UX/UI Design. Few examples below:
High-fidelity prototype examples
In the process, we had only a couple of iterations from the client’s feedback, all regarding the content itself, not related to the design process, with which they were thrilled.
E-commerce examples:
Online course examples:
Library components examples:
Conclusion
The website was a massive success. Immediately attracted new users who enrolled into online courses. The Client was very pleased.
