Jofersa web
We designed a website for Jofersa to showcase their product catalog digitally and strengthen communication between their represented brands and end customers.
Goal
The goal of the project was to develop a website that showcases the products distributed by Jofersa and helps build trust with the brands it represents.
Role
UI / UX Designer
Team
I was involved in this project as part of the design team at KMA Disseny.
Project duration
The project was successfully completed within a one-month timeframe.
Tools
Figma, Adobe Creative Cloud, Miro
Context
Overview
The project involved developing a website for Jofersa, a company with over 40 years of experience in the food machinery distribution sector. Jofersa offers personalized services and expert recommendations for food production machinery, while also being the exclusive distributor for a variety of brands. The website serves as a digital platform to showcase their extensive range of machines and provide comprehensive support, aligning with Jofersa’s reputation for customer-focused service and technical expertise.
Problem statement
How can we build a digital platform that showcases Jofersa’s product offering while also highlighting its partnerships with the represented brands?
pHASES
Project timeline
This timeline outlines the full journey of our project—from the earliest planning and design stages to the final launch.
empathize
User personas
By having a clear understanding of who our users are, we can develop more effective and tailored solutions. So, we create user personas to ensure that our design decisions align with the real needs of our target audience.
José Martínez
47 years
Airsoft Field Manager
Madrid, Spain
José has run his butcher shop in Barcelona for 15 years and needs to upgrade his machinery to meet growing demand. He seeks a trusted supplier who can provide reliable equipment, personalized guidance, and easy access to maintenance and spare parts.
Goals
1. Modernize his meat processing equipment.
2. Find reliable, easy-to-use machinery.
3. Get personalized recommendations based on his shop’s needs.
Frustrations
1. Worries about making the wrong investment in machinery that may not meet his needs.
2. Concerns about after-sales support and availability of spare parts.
Laura Gómez
35 years
Procurement Manager
Barcelona, Spain
Laura, a procurement manager at a food processing company in Barcelona, has over ten years of experience in supply chain management. She focuses on sourcing compliant machinery and values long-term partnerships with reliable suppliers to meet technical and regulatory needs.
Goals
1. Find trusted suppliers for reliable, industrial-grade machines.
2. Establish long-term partnerships with distributors.
3. Ensure compliance with food safety and production standards.
Frustrations
1. Difficulty finding reliable suppliers.
2. Concerns over long-term equipment reliability and potential operational disruptions due to faulty machinery.
brainstorming
Ideation and exploration
Following the HMW questions, we explored creative and strategic ideas to translate Jofersa’s strengths into an intuitive and impactful digital experience.
How might we help users feel confident in choosing Jofersa as their distribution partner?
How might we create a product discovery experience that helps users find the right machinery easily?
How might we offer meaningful support to our customers that reinforces trust and solves problems?
PROToTYPING
Information architecture
The information architecture of the web is designed for clear organization and easy navigation, ensuring users can quickly find what they need.
Prototyping
Wireframes
These initial designs help us quickly test and refine the app’s interface, allowing for effective iteration before development.
PROToTYPING
Design system / Sticker sheet
We created a Design System to ensure consistency, efficiency, and a seamless user experience across the web.
PROToTYPING
Hi-fidelity prototype
In the high-fidelity prototyping phase, we transformed wireframes into detailed, interactive designs that closely resemble the final product.
project
Takeaways
The development of Jofersa’s website was driven by the goal of creating a platform that not only showcases its product catalog but also communicates the company’s values: trust, expertise, and close relationships with both clients and represented brands.
Since the product is central to Jofersa’s identity, we chose to feature machinery prominently in the hero section. This immediately orients visitors and sets a clear focus from the first interaction.
To highlight Jofersa’s brand partnerships, we dedicated space to represented brands, reinforcing credibility through association and offering users a clearer understanding of the company’s network and authority in the market.
Navigation and structure were optimized for product discovery. Categories, filters, and visual cues guide users intuitively toward the machinery that best suits their needs, whether they are browsing broadly or searching with a specific goal in mind.
We included support touchpoints throughout the site. From clear contact pathways to potential areas for personalized advice, we aimed to mirror Jofersa’s reputation for close, knowledgeable customer service.