Overview
Bluco is on a quest to deliver a groundbreaking website to their customers and prospects. They began a redesign in hopes of creating a B2B application for existing customers to offer account information and pricing to parts they offer.
The ultimate goal of this particular project was to increase engagement with prospects and customers by creating a clean, easily accessible site to drive users to communicate with them (as they have a high conversion rate from prospect to customer). Other important key factors were to solidify the site architecture, create a dashboard space for current customers to access more private information, incorporate new branding and upgrading the UI, identify any usability issues with the beta release and determine the critical features to prioritize for the next iteration of the product.
My role: UX/UI Designer
User Research, Design Systems, Visual Design, UI Style Guide, Wire-framing and Prototyping, Dev Hand-off, Interaction Design
To view the prototype, click here. (Site is under construction - will post link soon!)
Background
Bluco is a Naperville-based manufacturing engineering company that designs custom modular solutions for manufacturing problems.
I make up half the marketing team at Bluco.
I joined Bluco initially as a graphic designer a year ago as one of 2 team members in the marketing department, with a company size of 50 employees. With the immediate demand to redesign their site - I demonstrated my skill set with user experience and use interface design and swiftly evolved my role into the company's product designer. I support design across every aspect of our business and am responsible for leading UX and UI across key parts of the website as well as the application side of the platform.
I've grown tremendously in the last year, some key achievements of which I have listed below:
4 months into my role I received an award for outstanding marketing support and was recognized during that quarter's company meeting.
- Implemented a design process. This has helped our team establish more structure to how we conduct our work and allow other teams to gain visibility across our upcoming sprints.
- Improved usability across the platform. No usability tests were conducted by the external consultancy before dev handoff. Since we established a design team, we have been actively working towards conducting UX research and usability testing on all projects.
- Establishing a design kit. This has helped to maintain consistency in the look and feel across different parts of the platform.
- Establishing a design system. This has helped the Engineering and Product teams to understand how and why we choose to implement certain components over others.
Understanding the Problem
Before Bluco had brought me on board, an agreement of the new platform had been implemented based on concepts executed by an external consultancy. These mockups were later found to be created without any usability testing and had little consideration for the technical and product limitations on the scope of work.
I've gathered all information from the company's stakeholders to uncover any pain points that they were experiencing with the previous version of their site.
My research encompassed:
- Understanding the user goals and needs
- Uncovering pain points with the existing user journey
- Determining the success of the tasks measured
Site Architecture
A strong pain point that was the way the previous site has been structured, some examples are listed below:
- There were duplicated "Customer Login" links within the same Navigation Bar, named differently.
- The navigation menu is messy, there is too much information broken up making it hard to locate a specific topic.
- There is no direct CTA located anywhere on the home page or other pages. It makes it unclear what the purpose of the site is.
User Flows
Concepting and Wireframing
I started sketching out how each page's content was organized. This method helped me think through design decisions and allowed me to test the different processes. This lead me to creating a solid foundation for the site.
UI Design
User Interface design had to reflect the current branding of Bluco which has not been implemented on the previous site. I had developed a new style guide that would be used for our internal marketing team as well as our development team. I made sure the website adhered to WCAG guidelines.
Prototyping
As design systems and styles we're developed, it was time to put the prototype in action. After adding in images and content, all there was left to do is hook everything up and test the usability.
You can view and interact with the prototype below.
Format for Mobile:
Results and Takeaways
Working in a small team was an extremely steep learning curve. It was an eye-opening experience that taught me a lot about being lean and knowing when and where to focus your energy and efforts.
Some key takeaways from this project are:
- Don't worry too much about the detail. Earlier in my journey, I made the mistake of worrying about adding in features that were like bells and whistles to comparison of the main UX. Taking a step back and reassessing the user flows helped me to reprioritize the UX.
- Focus on the problem. At the end of the day, it is your users pains that you will be solving for so keeping that front of mind is important as it's easy to lose sight of this when you're bogged down in the day to day.
- Simplicity is not always the solution. Over-simplifying the UX doesn't always guarantee flawless design. Since each digital product is different and unique to cater to their targeted user groups, expectations of what good UX is varies as well. Minimizing options and content can also cause confusion in the product.