Evangeline Ng
Product Designer
chipletstoremockup.png

Chiplet Store

Website | Product Design, User Interface Design

Chiplet Store

Players Involved:
Senior Designer and I

Organization:
zGlue

Time taken:
1 week


Project Brief:
Redesign Chiplet Library to accommodate 1500 quantity of Chiplets

What is a Chiplet Store?
The Chiplet Store was created as an open-source chiplet library for creators to go to for Chiplet information, such as to download the datasheet. It is also a repository of Chiplet Data that can be used to design your own chip on the ChipBuilder.

Business Goals:
One of the main business goals of the chiplet store was to drive traffic to the ChipBuilder.
The ChipBuilder is where creators can design their own chip.

Learning Points:

Applying Visual Skills to Improve UX
Through this project, I have learnt how to apply visual concepts like visual hierarchy to improve user experience.

The primary action in the Chiplet Store is to search for the Chiplet of consideration.
The search bar and button has to be the main focus, while the other call-to-action buttons that drive business goals must have a fair amount of emphasis as well.
For example: The other CTA buttons are “Add a new chiplet”

Please read more on my blog post at:
https://www.irrelevan.com/blog/2019/8/16/how-visual-design-can-improve-user-experience

Process Learning Points:
1. Understanding the priority of this project in respect to other projects they have.
Time constraint for the developers was also a big factor.
In a start-up, i realized that it is not only about pushing a project but also understanding the prioritization of this project i’m assigned to, to the bigger picture of workload and time schedule of the dev team. Hence, the designs could not steer too far away from the initial design.

Original Design of zGlue Chiplet Store

Original Design of zGlue Chiplet Store

Understanding the user

Userflow:
1. Google the chiplet of consideration E.g MAX1126
2. Clicks on first few links and read datasheet
4. Looks out for point of interest relating to work
3. If it is accurate they would then download it

By observing how systems engineer search for chiplets and a few guerilla interview sessions, the search was the main and primary action that they needed to find the Chiplet of consideration

Wireframing

Quick wireframing and presentation to gather feedback on layout

Quick wireframing and presentation to gather feedback on layout

Mobile Version

The mobile version made use of the existing code for interaction, while improving the UI by suggesting to users that they could scroll horizontally as well.

chipletstore-mobile.jpg
chipletstore-mobile.png

Conclusion

The Chiplet store was well-received by systems engineers during a recent EXPO we had in Shang Hai, China Sensors Expo. Internally, the product managed to meet business expectations and it was well-received by the CEO of zGlue.

View the Chiplet Store at:
https://zglue.com/products/chiplet-library

Resources:
https://www.nngroup.com/articles/mobile-tables/
https://www.joecaron.com/complex-table-for-mobile
https://medium.muz.li/complex-tables-356826d11861
https://www.smashingmagazine.com/2019/02/complex-web-tables/