UI / UX Design
Project
BUO UI/UX
Summary
Building Buo’s UI/UX Design Strategy from Scratch for an Innovative Talent Mapping and HR Platform
Responsibilities
UI / UX Design
Creative Direction
Art Direction
Overview
Buo is a groundbreaking talent mapping and HR platform designed to help companies connect with, map, and manage talent effectively. With a focus on simplifying the hiring and talent management process, Buo empowers HR teams and recruiters with tools to identify skill gaps, track employee performance, and build strong talent pipelines. As Buo prepared to launch, they needed a UI/UX design strategy from the ground up—one that would align with their mission of creating a user-friendly, trustworthy, and engaging platform for HR professionals.
In 2023, Buo partnered with us to conceptualize and build the platform’s UI/UX design strategy from scratch. Our goal was to create an intuitive, visually appealing, and highly functional platform that would make it easy for HR teams and recruiters to navigate, manage talent data, and engage with key features. By focusing on foundational design principles and user-centered processes, we crafted a UI/UX strategy that established Buo as a standout in the HR tech space.
Client: Buo
Project: UI/UX Design Strategy from Scratch
Sector: Talent Mapping, Human Resources, HR Tech
Date: 2020
The Challenge
Launching Buo as a new HR platform required a robust, user-focused design strategy that would meet the needs of HR professionals and provide them with intuitive tools for talent management. Starting from scratch, we faced several challenges in developing a clear and engaging UI/UX strategy that would support Buo’s objectives and resonate with its target audience.
The key challenges included:
Defining a Clear User Experience: With no existing design framework, we needed to conceptualize the end-to-end user journey from scratch. The design needed to anticipate user needs and streamline the workflows for different HR tasks, such as talent mapping, skill gap analysis, and performance tracking.
Building Trust and Security Features: For a new HR platform, establishing credibility was essential. HR professionals needed to trust the platform with sensitive data, so we needed to incorporate trust-building elements from the very start.
Intuitive Talent Mapping Process: Talent mapping can be complex and multi-layered. We needed to design a feature-rich, yet easy-to-use mapping tool that would allow HR teams to manage and visualize talent data without feeling overwhelmed.
Mobile Optimization for HR on the Go: Many HR professionals access platforms on mobile devices, especially when managing remote teams or distributed workforces. Designing for mobile use from the beginning was essential to ensure that Buo was accessible anytime, anywhere.
Creating an Engaging and Professional Look and Feel: As a new HR tool, Buo needed a polished and modern design that would appeal to HR professionals and create a memorable first impression, standing out in the competitive HR tech landscape.
The Solution
Our approach involved building a UI/UX design strategy from scratch, focusing on user-centered design principles and crafting every element to address the unique needs of HR professionals. From ideation and wireframing to final visual design, we created a cohesive, intuitive, and secure user experience for Buo.
The solution featured:
1. User Research and Persona Development
To ground the UI/UX design in real user needs, we conducted extensive user research and developed detailed personas representing Buo’s target audience. This process was crucial in understanding the workflows, pain points, and needs of HR professionals and recruiters.
User Interviews and Surveys: We interviewed HR professionals across industries to understand their day-to-day challenges and identify what features would be most valuable in a talent mapping tool. Insights from these interviews helped us define key user flows and prioritize features.
Persona Development: Based on our research, we created user personas for HR managers, recruiters, and talent acquisition specialists. These personas guided design decisions, helping us focus on the unique goals and frustrations of each user type.
2. Information Architecture and User Flows
We mapped out the information architecture and created detailed user flows for Buo’s platform, ensuring that each feature had a clear, intuitive path that aligned with user expectations.
Information Architecture (IA) Blueprint: We developed an IA blueprint to organize Buo’s features logically, with sections for talent mapping, performance tracking, skill gap analysis, and user profiles. This structure helped users easily locate tools and understand the platform’s capabilities.
User Flow Diagrams: We created user flows for essential actions like creating a talent map, adding profiles, and running analytics. By carefully mapping each user journey, we ensured that the platform’s navigation was intuitive, reducing the learning curve for new users.
3. Wireframing and Prototyping
Starting with low-fidelity wireframes, we began to outline Buo’s visual structure and interaction patterns. This iterative process allowed us to quickly test ideas and refine the user experience before moving to high-fidelity designs.
Low-Fidelity Wireframes: These initial sketches focused on layout, functionality, and content hierarchy. By quickly iterating on wireframes, we identified potential issues early and refined the structure to improve user flow and accessibility.
Interactive Prototypes: We built interactive prototypes to simulate the user experience and allow stakeholders to test the platform’s functionality before development. These prototypes helped us gather feedback and make adjustments based on real interactions, ensuring a seamless final product.
4. Building Trust and Security from Day One
To encourage HR teams to trust Buo with their talent data, we integrated several trust-building elements and security features from the very start. Our goal was to establish Buo as a secure and reliable platform for HR professionals.
Profile Verification Badges: Profiles were given verification badges, which signaled to users that the data and credentials were verified, helping them feel confident when interacting with talent profiles.
Data Encryption and Privacy Features: We emphasized secure data practices in the design, with data encryption indicators and privacy settings accessible on profiles. This reassured HR professionals that their data would remain safe and confidential.
User Reviews and Ratings for Verified Profiles: Users could leave reviews on talent profiles, allowing HR teams to assess previous feedback. This added transparency and gave HR professionals the confidence to rely on Buo’s data.
5. Mobile-First, Fully Responsive Design
Understanding the importance of mobile accessibility, we designed Buo’s platform with a mobile-first approach. This ensured that HR professionals could access and manage talent data on the go without compromising on functionality or usability.
Touch-Optimized Interface: We implemented large, easy-to-tap buttons, swipeable interactions, and a simplified layout to improve the experience for mobile users. Key actions like adding profiles, accessing reports, and viewing talent maps were optimized for mobile devices.
Responsive Design for All Devices: The platform’s responsive design ensured it adapted seamlessly across different screen sizes, from desktops to tablets to smartphones. This created a consistent experience across devices, supporting HR teams whether they were working in-office or remotely.
6. Clear Calls-to-Action and Engagement-Driven Design
To encourage engagement, we implemented clear calls-to-action (CTAs) throughout the platform, guiding users to take specific actions and explore Buo’s features.
Prominent CTAs for Key Actions: We strategically placed CTAs for primary actions, such as “Map Talent,” “Add Profile,” and “Analyze Gaps,” throughout the platform. These buttons were highly visible, encouraging users to engage with Buo’s features.
Interactive Elements for Engagement: To enhance user engagement, we added interactive elements such as toggles, sliders, and hover effects. These small touches made the platform feel dynamic and responsive, improving the user experience.
The Results
The UI/UX design strategy for Buo’s platform resulted in a highly intuitive, engaging, and professional HR tool that was well-received by HR professionals and recruiters. By building a strong foundation for user experience, we created a platform that simplifies talent mapping, enhances discoverability, and fosters trust among users.
Key results included:
High User Adoption Rate: Thanks to the intuitive design and clear user flows, Buo achieved a high adoption rate among HR teams and recruiters. Users were able to understand the platform quickly, resulting in a 50% increase in user sign-ups within the first three months.
Streamlined Talent Mapping Process: The simplified talent mapping process was highly effective, with a 40% increase in talent maps created. HR teams found the mapping tool easy to use, enabling them to develop clear talent strategies and address skill gaps effectively.
Positive Feedback on Trust and Security Features: Feedback from early users highlighted the value of the trust-building features, such as verification badges and secure messaging. This resulted in a 30% increase in user confidence and engagement on the platform.
Increased Mobile Engagement: With the mobile-first design approach, mobile traffic grew by 45%, and mobile engagement increased by 35%. The optimized mobile experience allowed HR professionals to manage talent data seamlessly from any device.
Wireframes and Design system
Conclusion
Credits
Design
Eduardo Calvo – Design Manager
Pablo Rodríguez – Product Manager
Team
Rafael Ortega – Technical Lead
Let's grab a coffee
And Chat!
Copyright © 2025 EduCalvo. All Rights Reserved