W

ebsite design
website
of welding
equipment
for e-commerce

The task

This client came to me with existing home page design. The task for me was to refine it and make a design for inner pages of e-commerce website. Build a design system with components, make adaptives and prepare file for development.

About project

Weldbusiness — company selling welding equipment across EU. They are official distributors of KEDR welding machines

The main problems of the existing home page design


  • Messy font + color styles: 3 fonts that looked the same, 3 shades of grey… all doing the same job.
  • Raw components: some existed, some didn’t, and some were a mix of random local styles inside.
  • No layout structure: different indents everywhere — like each block lived its own life.
  • Outdated effects: we had to clean it up and make it feel fresh.
  • Not enough content for slider cards: so I designed the missing ones in the same style to complete the set.

What was done

  1. refined the existing homepage design
  2. built a design system with styles and components
  3. designed the inner pages
  4. adaptives design
  5. prepared everything for developer hand-off

Catalog pages

We had 2 core pages for the catalog: categories and page with filters and products. On this stage I I worked on catalog filtering, refined product cards, and expanded the design system with new components.

Product's page

The idea was to get the most important information on hero screen: price, delivery, opportunity to buy and compare products. Detailed info about product, reviews and delivery/payment was placed below with tabs to navigate through it

UI kit

After design was finished I made UI-kit for hand-off to developer. Since all the styles of fonts/colors were chosen by previous designer, I've just refined all to be consistent, and structured them to a clear design-system.

Results

Website design was structured and scaled. I prepared it to developer hand-off. Client was content with the quality of my work
“
Karina did a great job on this project. What I especially appreciated is that she worked very carefully with the existing design instead of trying to redesign everything from scratch. She improved the consistency of the layouts and built a structured component system in Figma, which made the files much easier for developers to work with

What did you particularly like about working with me?

“
Communication was smooth and the process was efficient. Karina was responsive to feedback and ready to make adjustments when needed. I would definitely recommend Karina for UX/UI projects, especially when you need someone who can refine existing designs and turn them into clean, developer-ready systems
Anastasiia, the client
How do you like the project?
Bratskiy Fulfilment
Website redesign for fulfilment
EE-School
Multipage website for a foreign languages school
Another cases