EMCOL
Lead Product Designer (Huss & Sam)
4 months
Mobile-first UX/UI Design,
Design System & Icon Design
Emcol, a leader in industrial engineering systems, faced a significant challenge: their extensive product range was buried within a complex, legacy-driven website.
My role was to architect a dedicated mobile experience that strips away the noise and provides customers with a streamlined, visual, and intuitive way to navigate thousands of technical components.
The existing website, tied to a complex Priority ERP system, resulted in a cluttered and overwhelming interface. For professional customers looking for specific components, the experience was hindered by:
Sector Overlap – Users had to navigate through irrelevant data (buses, heavy machinery) just to find industrial parts like bearings or steam equipment.
Visual Blindness – Small images and dense technical jargon made quick product identification nearly impossible.
Structural Chaos – The lack of a clear hierarchy meant that thousands of products were presented without a logical flow, leading to high friction and user frustration.
The app was designed to simplify product discovery and improve communication through a structured digital interface:
Strategic Categorization – The existing database was restructured from technical “Types” into intuitive “Categories” and sub-categories. This shift allows users to navigate logically through departments like Bearings, Metals, and Steam Equipment.
Enhanced Visual Context – Each category page includes manufacturer logos, descriptive imagery, and video content. This provides a clear understanding of the product line before the user is directed to the main website.
Streamlined Connectivity – A persistent bottom navigation (Home, Products, Search, Contact) ensures immediate access to core features, while direct links to the Emcol site facilitate seamless inquiries.
Real-Time Updates – Integrated push notifications allow the company to share promotions and product modifications directly with their professional client base.
Note: An e-commerce feature was initially proposed but was not implemented due to budget constraints.
To resolve the navigation challenges of the original website, I analyzed the industrial product range and identified key friction points in the customer journey.
Key Insights
The existing site was not intuitive, making it difficult to locate specific components within the cluttered catalog.
There was a clear need for a simplified interface that bridges the gap between technical data and user understanding.
Customers required a direct channel for real-time updates and promotions, which the static website could not provide.
The design system was built upon Emcol’s established brand identity to maintain professional continuity while optimizing for mobile usability.
Brand Integration – I adapted the company’s existing color palette and typography into a digital framework, ensuring the app feels like an integral part of the Emcol ecosystem.
Clarity & Function – I designed custom icons and UI components to solve the legibility issues of the original site, creating a clean interface that prioritizes quick product identification.
The core objective was to transform the complex, web-based catalog into a streamlined mobile tool. I focused on re-engineering the user journey to prioritize speed and ease of use, ensuring that professional users could find technical parts without the friction of the original site.
The button “Purchase” is a link to Emcol web
Key Decisions:
Efficient Product Discovery – Implementing a structured category hierarchy and advanced filtering to help users narrow down thousands of technical parts and reach the exact product quickly.
Direct Communication – Integrating push notifications to bridge the information gap, providing users with immediate updates on promotions and product changes.
Ideas Not Approved (Due to Budget Constraints):
Efficiency Tools – Features like “Favorites” and product sharing for quick access to frequently viewed items.
Transactional Features – An in-app shopping cart and direct purchasing capabilities to complete the sales cycle within the app.
Support Automation – A dedicated chatbot designed to provide immediate customer service and technical support.
The final application provides Emcol with a streamlined digital tool that simplifies complex product browsing and strengthens customer engagement.
By transforming a cluttered web catalog into a focused mobile experience, the app successfully bridges the gap between technical data and user needs. Initial testing indicated high user satisfaction with the new organizational structure, intuitive navigation, and real-time notification features.
The development of the Emcol app demonstrated how strategic design can transform complex legacy data into a functional business tool.
User-Friendly Navigation
A logical category hierarchy and smart filtering are essential for navigating large, technical inventories efficiently.
Budget Management
Creative prioritization ensures the delivery of high-impact features and core functionality within budget constraints.
