They Specialize in unique pens, mechanical pencils, 3-in-1 multi-pens, and various stationery items. I use their products daily. Most of my purchases have always been on third-party seller sites. At some point in my usage, I had never been to their company site. To my surprise, the site looks like it was from the early 2000s. I decided to give the site a refresh.
To begin this project, I did some UI research. The sites that I checked out were E-commerce sites that are in this realm.
The first bit of research I did was a competitive analysis of 3 similar brands.
The competitive analysis shows that there are standard structures for most E-commerce sites. Several dated elements are on the sites — most specific, the search & icons.
I wanted to focus on to be on the hero image. Their items operate on a grand scale, so they should display that way. Also, I set my sights on making the technology the pens use of a feature too.
The flow and balance of the elements come together well from sketch to the layout of the Grayscale wireframes. Everything is base off of a 4px baseline grid.
The layout of the hi-fi mock-ups follows the basic structure of the wireframes. The colors are referencing the current site. Everything came together well to bring the site to a contemporary style.
I will include updates to the color palette, exploring more attractive options. Also designs for mobile and tablet layout options. Lastly, a clickable prototype of the rebuilt website.
Thank you!
