WEB CMS
USER EXPERIENCE
USER FLOW
PROTOTYPING
INFORMATION ARCHITECTURE
VISUAL IDENTITY / BRANDING
Ingkle
At Hi-Fi Design Studio, I led the website redesign for Ingkle, working with two UI/UX designers and a developer to create a user-friendly interface and refresh the brand’s digital presence. Our goal was to effectively communicate Ingkle's industrial IoT expertise and solutions to manufacturing and environmental companies worldwide.
My role involved prioritizing the needs of the target audience and applying UX design principles to ensure user convenience and seamless navigation throughout the website. I participated in weekly team meetings to refine the site for the specialized B2B IoT services. The redesign led to a 20% increase in conversion rate, a 5% boost in average session time, 5% more page views per session, and a 30% return rate, while also supporting global expansion with Korean and English language options.
Sungah (Stella) Kim | Jay Han | Tony Baek
UX/UI Design | Wireframing & Prototyping | Design System | Branding
Figma | Adobe Photoshop | Webflow
Apr 2023 - Jun 2023 (6 Weeks)
Overview
Ingkle is a company that supports digital transformation within the manufacturing and equipment industry. They specialize in providing end-to-end solutions, from data collection to big data platforms, real-time monitoring, and AI analysis. Their goal is to accelerate innovation and cost savings in the digital transformation process for industrial companies. Ingkle's expertise lies in delivering Industrial IoT (Internet of Things) solutions, targeting manufacturing and environmental companies worldwide to enhance operational efficiency and sustainability.
Our goal was to establish Ingkle as a trusted expert by delivering professional solutions through a new website design, data visualization, and comprehensive design systems.
Goals
To create a connection between equipment and humans, leading to transformative changes in work and production methods at manufacturing sites. This connection will serve as the guiding principle for all decisions and processes related to IoT solutions.
1.
Reflect the latest company updates and enhance credibility.
Improved user experience by restructuring information, enhancing content like references, certifications, and testimonials. Rebranded the company, reinforcing its image with a high-tech, futuristic, and sophisticated appearance.
2.
Building a user-centered website and optimizing the experience.
3.
Achieving KPIs and supporting global market expansion.
Define Problems
We reviewed each page, marking and collecting data to analyze what aspects were poorly designed and identifying areas that were lacking.
As the homepage serves as the entry point and first impression of the company, this B2B provider, supporting digital transformation in the manufacturing and equipment industry, faced growing challenges as their audience, content volume, and brand needs expanded.
Firstly, there was a lack of design consistency across the site. Each page needed clear structuring to help users easily understand whether they were reading about products or company information, which hindered building trust and credibility. Additionally, the absence of clear calls-to-action on each page made it difficult to guide users toward achieving their goals.
The original homepage, it was difficult for users to understand the products, lacked strong branding and credibility, and did not clearly highlight product strengths. The flow was disjointed, with missing calls to action, making it harder for users to request a product demo as desired by the client.
From the start, my team and I identified the key information they wanted to retain and pinpointed the main issues on the current pages.
Approach
Our primary challenge was to develop a design system that met the client’s request for a comprehensive B2B branding overhaul. To tackle this, we executed a complete redesign of the company’s branding, restructured the information architecture, and crafted a user flow that ensures a seamless journey toward their key objectives. Starting from scratch, we designed new branding and a website that reflects the company's story and goals. This approach enabled us to work efficiently, stay flexible, and explore various options for user flow and architectural design.
Information Architecture & Sitemap
We recognized that the main issues were not just with the design but also with the user flow and information architecture. To resolve this, we reorganized the website to reduce user confusion during navigation, ensuring all necessary information is included and well-structured on each page.
Wireframe
My team and I explored various wireframe styles to visualize layout options. By implementing a design system, we ensured consistency across pages, using the same templates with tailored content.
We conducted up to four revisions after each meeting, refining options until we reached the best solution.
Here are the final wireframes before adding visual elements, colors, and transitioning to Webflow development. By focusing on clarity in this low-fidelity stage, we ensured that each page is easy to understand and that users can quickly access key information.
Design System
Guided by Ingkle’s core values—Human-Centered, Connected and Consistent, Professional and Minimal, Solution-Oriented and Intuitive—our team developed a design system that embodies these principles, creating a user experience that communicates each of these elements effectively.
Final Designs
Here is the final navigation design: when hovering over each section on the menu bar, a dropdown displays submenus, allowing customers to easily locate the page they need. This design reduces customer loading and navigation time, helping them reach their goals faster.
This page shares details for other businesses and products, using the same template. A CTA button allows visitors to contact them and request a demo, minimizing delays. Each section highlights the advantages, and at the bottom, users are guided to related pages for further information.
The demo request page now remains within the same website, unlike the previous design where it redirected outside, which felt unprofessional and inconsistent
Adding an FAQ section makes it easier for users to find answers directly about the company, products, and services, reducing the need to wait for responses. Instead of embedding a map, a CTA now links directly to an interactive map.
The new Careers page at Ingkle minimizes unnecessary external visits by keeping everything on the website. It features a CTA link for job openings that directs users to related pages, ensuring a smooth user flow and helping them identify their needs and goals.
Impact
After redesigning and launching the site through Webflow, we tracked analytics to measure the impact of the new design and system on the client's core metrics. The results revealed a significant increase in overall website usage.
Content Conversion
+20%
Session Frequency
+30%
Session Intensity
+5:00 sec
+5 page views