- Introduction
Fogaskerékgyár is an industrial company specializing in the manufacturing, design, and repair of gears and gearboxes. Their current website meets basic informational needs but has an outdated visual design and cumbersome navigation. The goal is to design a modern, user-friendly platform that helps customers quickly find information and increases online conversions. - Problem Definition Main challenges
- Outdated visual design – The website doesn’t follow modern UI trends.
- Complicated navigation – Information is not easily accessible in a logical structure.
- Missing CTA elements – There are no clear calls-to-action for quote requests or contact.
- Lack of interactive features – No product search or quote request form.
- Target Audience
The website is mainly used by industrial procurement managers, engineers, and manufacturing partners who need quick access to the company’s services and products. - Key user groups
- Industrial company procurement managers – They are looking for quick and accurate information on available gears and gearboxes
- Engineers and designers – They need technical specifications and downloadable documentation.
- Job seekers – Those looking for industrial jobs.
- Research and Analysis
- Competitor Analysis
I analyzed the websites of other industrial component manufacturers and identified the following best practices:- Clean, modern UI - Contrasting, easy-to-read design.
- Interactive product search – Simple filtering and fast search.
- Downloadable technical documentation – PDF and CAD file availability.
- Effective CTA elements – "Request a quote" button on all relevant pages.
- User Feedback
Feedback was collected from the website’s existing and potential users, and the following main problems were identified:- Hard-to-find product information
- Slow page loading
- Lack of mobile optimization
- Unclear quote request process
- Design Process
- Information Architecture Overhaul
I restructured the existing menu system to allow users to find content faster. - New main menu structure
- Homepage
- Products
- Machinery Sales
- Careers
- UI Design (Visual Concept)
- UI libraries
I have used ACS UI Library Design Kit, Minimalist UI Kit - Free Figma UI Kit & Component Library v1.0 (Community) and UI3 Design System - A Modern, Accessible Component Library as an inspiration for my design. - Color Palette and Visual Style
To achieve a modern industrial look, I applied the following colors:- Dark blue (#1E3A5F)–Professional, industrial appearance.
- Light gray (#F5F5F5)–Cleanliness and readability.
- Orange (#F08C00)-Helps to gain attention
- Typography
- Headings: Montserrat (modern, industrial style).
- Body text: Open Sans (readable, clean).
- Testing and Iteration
During prototype testing, I involved 5 users, and the following major improvements were highlighted:- 50% faster information retrieval
- Clearer quote request process
- Redesign Results and Impact
- Improved user experience – Easier navigation and faster information access.
- Better conversion – More quote requests thanks to clear CTAs.
- Next Steps
- Finalizing the high-fidelity UI mockup
- Transitioning to the website development phase
- Post-launch measurements and refinements
- Making a responsive design
- Summary
All in All, I have managed to modernize this page and made it user friendly, which was my main goal. I had to overcome the fact that the customer wanted to keep the design simple and minimalist. I believe I stuck to it but I made it also eye-catching.