New digital platform for one of the world's leading electronic components companies, streamlining IA, navigation, and search.
As the Senior UX/UI Designer for Icreon, I led the creative team in designing this project from the ground up. I interfaced with clients and internal stakeholders, and designed and implemented the creative and visual direction for this project as well as the user experience. I oversaw the Junior Designer on our team as she worked with a strategist on the research portion of the design process, and mentored her through the design process.
Through direct and indirect research we immersed ourselves in the client’s business – their current content organization, visual language, tone and voice, business processes, and their goals for the future.
In this project, the competitive analysis and exploration of current user pain points were especially important. The client sells thousands of specialized products that need a high level of specific knowledge to even understand how to look for them.
We dove into their particular audience – current as well as aspirational, which guided a lot of how we implemented Search and Filtration, as well as how we promoted individual products.
I led the junior designer and junior strategist on my team to create design research artifacts to aid in our future designs and to present our findings clearly to our clients.
Personas are crafted through individual users’ goals and needs, but also the circumstances in which they are engaging with the client’s business – are they relaxed and at home? Traveling? Working? Context and circumstance often drive the most interesting decisions, and only through our careful exploration can we understand and direct those choices. Through mapping this research of business goals and users’ needs, we can identify current pain points and suggest areas of opportunity.
Market comparison and analysis
Audiences and personas
Users’ needs support the shaping and optimization of the content organization and ultimate Information Architecture, which in turn helps us map their journeys and outline specific user flows. By crafting these narratives and pathways – creating the experiences we want for people in accomplishing their goals – and with all our accumulated data informing our decisions and direction, our team moves into the next phase of the design process.
After gathering + prioritizing the business goals and user needs, and planning the basics of the new Information Architecture and framework for the new platform, I pulled together three design directions for our client to choose from.
Emphasizing specific personalized content for each core audience.
Option 1: Planned Personalization
Emphasizing knowledge, this option prioritizes a suggestion tool to bring direct recommendations to each audience.
Option 2: Did you know?
Direct and to the point for the three main audiences of Investors, Engineers, and Students.
Option 3: Portal
After compiling our research results and drafting our plans, I worked with my junior designer to create a comprehensive organizational structure for the extensive product library.
Then I began sketching and wireframing, creating the UX structure based on the purpose and direction for each page, projected responsiveness and motion, and mapping out interaction models.
Redesign of Information Architecture and Improved User Flows
Smoother, More Intuitive Access to Products and Purchases
Initial planning and sketches
Wireframes
The clients selected Option One from the options the strategist and I presented, but wanted a modified landing section of the homepage to incorporate the ability to showcase multiple hero messages.
So as the next phase of the design process, I developed the designs for more nuanced visuals and motion design. As I designed out the platform, I crafted a visual language for the client’s new digital platform, and developed a flexible design system to accommodate the range of content they had planned.
I designed for growth – with this toolkit and visual library, the digital product is infinitely scalable, adapting to fit new business directions and shifting goals.
Iterations
Menu + Navigation Experiments
Initial Market-Based Search Module
Search Refinement Iterations
Predictive search and extremely organized product divisions and subdivisions became key to this entire project. Working with my strategist and testing at key points, we refined the design of the navigation and search multiple times to hone in on the best experience.
Throughout our design process, I made sure to connect with the client’s team at key points in the process to check in on priorities, content, and goals, and produce the best combination of business and user needs and experience in the final product.
Streamlined, Organized Navigation and Menu
Predictive Search accessible throughout platform
Refined, Flexible Parametric Search and Dynamic Filtration
Versatile Side Drawer
With three distinct core audiences, I wanted to give each type of user exactly what they needed quickly and easily. Engineers, Students, and Investors all have unique needs when they come to the site, all while making sure everything feels cohesive.
Engineering Hub with a Comprehensive Toolkit
Personalized Experiences and a Suite of Investor Resources
Comprehensive Product Details designed for Engineering Needs and Purchasing Workflows
Focus on Sustainability
As a leading supplier in the industry, the client wanted to emphasize their thought leadership in the field, so I designed an elevated experience for that type of content on their platform.
Promotion of Thought Leadership
Our team’s design process doesn’t stop when development phase starts, and I maintain constant communication throughout the development process. We work closely with our development team to translate concepts and designs throughout the building process, and proactively grow and adapt designs to solve any issues and address any feedback that comes up during development and user testing. Even after the design is “finished,” built, and deployed, we continue to collect data and feedback, evaluate, and design for growth over the life of the digital product.