Overview

Avnet Inc., being the the largest semiconductor distributor in the United States, wanted to energize the look and feel of their web ecosystem and strengthen the brand recognition across the board.

My role in the UX team included setting up the information architecture, conceptualizing the new styles, and providing style references for both the design and development teams. I also trained and assisted the content authors and streamlined the web page production process.

The Challenge

• Bring a new look to the web ecosystem.
• Improve overall usability
• Make the website mobile-friendly
• Put style references in place for future usage
• Complete all above in limited time frame

Solution

• Refine the information architecture
• Provide style guides for future references
• Design smart web components to increase efficiency to the web page production process

The Process

1 Identify the users and their expectations

Manufacturers

• Semiconductor companies partner with Avnet to sell their products. They want more exposure and accurate content to reflect their values.
• Content update is constant, especially in this competitive market. They always want their content published yesterday.

Engineers

• Electrical engineers utilize Avnet's website for design resources. They could be full time employees of consumer product companies, or hobbyists.
• They mostly use the technical knowledge base and the technical support forum. When they need help for their design, they want to find support quickly.

Purchasing Managers

• Purchasing managers go to Avnet's website to buy parts needed for their companies. They buy in small or large quantities.
• They need the product quote process to be easy and the pricing to be transparent. When they have questions, they want to be able to locate help easily.

2 Identify problem areas and refine the information structure

1. Navigation
   1. No highlight of current page identified.
   2. There was no page title on the page. The user has to rely on breadcrumb to know the current page.
   3. Sub navigation was repeated and scattered around on the same page.
2. Account management items to be organized for better usability.
3. Search bar and shopping cart not at consistent location throughout the site, making it harder to find on some page than the others.
4. Prominent content not being most relevant to what the users need.

1. Navigation
   1. Highlight current page on the main navigation.
   2. Display page title along with a short introduction. 
2. Fix account management items on top of every page, including the shopping cart.
3. Fix the search bar to be on the same location across the site, always on the top right.
4. Provide design tools and information that align with what engineers would need on the site.

3 Conceptualize visual presentation

Exploring different color options and organize content elements in a modern way.

4 Document design decisions and style references

Outcome

Design resource page on the Avnet website, before and after:

EBV Electronik, an Avnet child company, homepage before and after. The brand now share the similar look of its parent company.