Navyonline.com E-commerce Website Development and Video Production
Navyonline.com is the online storefront for the Naval Academy Business Services Division (NABSD) at the United States Naval Academy. While NABSD has two physical shops located on the Naval Academy grounds in Annapolis, MD, Navyonline.com allows them to extend their reach and get their products and message in front of more people. And their message is clear: 100% of all the shop’s proceeds go back to the midshipmen.
Key project features:
Developed in HubSpot
A HubDB-based product page with search bar, price filter, and sale selector
A HubDB-based Social Quick Links Page displaying recent social posts
Video editing and motion graphics for featured homepage video
The redesign of the online store had a 2-step approach, to ease the transition of the NABSD store from its aging e-commerce database to a fresh one. First, the shell of the website—the front-facing and more content-heavy pages that surrounded the e-commerce platform—needed to be redesigned with the new brand our creative team had crafted.
Step two was to set up the core of the site—the e-commerce shop where customers could select and purchase Navyonline merchandise—on an entirely new platform with a cleaner look that matched the redesigned shell I developed.
For the first phase of this redesign, I used the mockups provided by my team to develop a new homepage, the top-level store category pages, and templates for resource and landing pages.
I also created lower-level product pages, a place for a visitor to land when traveling from a higher-level page like “Women’s” to “Women’s Outerwear”. These pages are no longer in use, but for a time they served as a way for us to list available products before sending visitors off to the true e-commerce platform to purchase an individual item. Using HubDB, I was able to create a functioning search and price filter for each of the product pages, and I even built a way for account managers to set certain items on sale at a percentage of their choosing.
As part of a later marketing project, I edited and created motion graphics for a promotional video that was used on social media and featured below the hero image on the site’s homepage.
To see the full site and promotional video, visit Navyonline.com.