Prior to the design upgrade that I’m about to tell you about, we had been running the same layout on our series and part number pages for about 5 years. They had a good run and were responsible for millions of pageviews, downloads, samples, and more, but the Internet evolves quickly, and it was time for an upgrade.
Here are the details.
Upgraded Series Page
The first thing you’ll notice here is the cleaner look and wide-screen layout. We stripped out the previous “sticky menu” at the top in favor of a scrolling side navigation. This provides a cleaner experience and gave us more space to use at the top of the page. It also gives the page a much faster feel, as the user isn’t waiting for the sticky menu items to load before interacting. The near-full-width layout also provides the user much more screen space to configure products.
Next, we moved the configurator further up the page and expanded its size to allow users more room to build products. We also moved the product description and series name to the right-hand side and moved the product features to a block of their own. This furthers clean up the top portion of the page and puts the focus clearly on building products.
We also increased the size of the resulting configured part number, made the link clickable to the next page, and cleaned up some of the call-to-action buttons to be easier to use.
All of these layout upgrades result in a much cleaner and user-friendly design that allows users to get to a configured product even more easily than before.
Take a look here for a great example of the new series page design in use.
Upgraded Part Detail Page
We also upgraded the part detail page with many of the same upgrades, such as the wide-screen layout and the cleanup of the top portion of the page, but since this page is much more complex, we took it a few steps further.
The previous page featured a 3D model viewer and a model download tool that were very useful, but a bit redundant. It also featured an eCAD download tool which was a similar experience. To take full advantage of these tools for users, we collaborated with our partners to build an integrated experience.
Users can now download eCAD models and mCAD models in the same viewer, and can even combine the downloads for easier workflow with 3D models, prints, symbols, and footprints. This is implementation is an industry first, and another free design feature for Samtec.com users.
We also upgraded the design of the pricing area of this page. We combined the Pricing, Stock, Similar Parts, and Packaging Info all into a single tabbed panel, which allows for better use of screen space, and easier access for users vs looking around various parts of the page.
Lastly, we moved the action buttons up the page to the top so users have quick access to Add to Cart, Get Pricing, or Request a Free Sample.
All of these layout upgrades result in a much cleaner and user-friendly design that allows users to get to a configured product even more easily than before.
Take a look here for a great example of the new part detail page design in use.
Next Up for These Pages
On top of these upgrades, this new design opens up several possibilities for future enhancements to this page, such as additional personalization using our new profile system, the addition of previously searched and recommended products, an updated product configuration experience, and a faster page as we continue to reduce dependency on legacy systems.
Coming Soon to Samtec.com
That’s it for now. Thanks for reading and being a Samtec customer. Here is what we’re currently working on, and a few other updates that are coming soon!
- Continued upgrades to our e-commerce experience throughout the website
- Continued updates to manage profiles online
- An updated RF Cable Builder experience
- An updated way to search High-Speed Board-to-Board Products
- An updated way to build Optics products online
- And more…
Keep an eye out for these updates and more coming soon!
Drop your email address in the form below if you want to stay in the loop with these updates, and as well as the rest of our blog content.
If you have any feedback or suggestions for our web team, feel free to send an email at eHelpDesk@samtec.com.
Leave a Reply