Canon UI Design

Client
Canon UK
Category
Web Design
Tools
Sketch

Overview

Canon B2B UK, a leading provider of imaging solutions and services, approached us with the goal of creating a new user interface (UI) for their website. The current UI was outdated, and Canon was looking to provide their customers with a more modern and user-friendly experience. As a team, we were excited to take on this challenge and began by defining the project goals and conducting thorough research to gain a deep understanding of Canon's target audience and their needs.

My Process

Step 1: Define

The project was to design and develop a user interface (UI) for Canon B2B UK, a leading provider of imaging solutions and services. The UI needed to be user-friendly, visually appealing, and provide customers with easy access to Canon's products and services. The goal was to create a UI that would enhance the user experience and ultimately increase sales for Canon.

Step 2: Research

To begin the project, we conducted extensive research on Canon's target audience, their needs, and their pain points. We also studied the competition and analyzed their UIs to identify trends and best practices. We then conducted a thorough analysis of Canon's existing website to identify areas that needed improvement.

Step 3: Analysis & Planning

Based on our research, we developed a plan for the new UI. We created user personas, identified key features, and prioritized the content that would be displayed on the UI. We also established a clear information architecture and developed wireframes to provide a visual representation of the new UI.

Step 4: Design

With a solid plan in place, we moved on to the design phase. We created a visual design for the new UI that was consistent with Canon's brand identity and provided a modern, clean, and easy-to-use interface. We designed the UI to be responsive, ensuring that it would look great on any device.

Step 5: Prototyping

Once the visual design was complete, we moved on to the prototyping stage. We used interactive prototypes to test and refine the UI's functionality, layout, and user flow. We tested the prototypes with real users to gain valuable feedback and make further improvements.

Step 6: Testing

After completing the prototypes, we conducted extensive testing to ensure that the UI was functional and bug-free. We also conducted usability testing with a group of users to gain further feedback and make necessary changes.

Step 7: Launch

With the testing phase complete, we launched the new UI for Canon B2B UK. We provided training for Canon's staff on how to use and manage the new UI, and we monitored the site's performance to ensure that it met Canon's goals.

Step 8: Iteration

After launch, we continued to monitor the UI's performance and gather user feedback. We made iterative improvements to the UI based on this feedback, adding new features and refining existing ones to ensure that it continued to provide a great user experience.


The tonality of the new UI design was aimed to be consistent with Canon's brand identity, conveying a modern, clean, and professional image to their customers.

The Wireframes

Conclusion

In conclusion, the new UI we developed for Canon B2B UK was a great success. It provided a modern and intuitive interface for customers to browse and purchase Canon's products and services. The UI's improved functionality and user experience resulted in increased sales and customer satisfaction for Canon.