Five Techwe are

Custom eCommerce & Responsive Design for Retail Outlet

A retail fleet supply store with locations in Minnesota and Wisconsin, L&M Supply looks to extend their customer reach and hedge their future by implementing an ecommerce store.

L&M Supply was started in 1959 in Grand Rapids MN and has expanded to 8 locations in Minnesota and Wisconsin.  As a successful brick and mortar operation, L&M was starting to lose revenue to the internet.  Rather than become a statistic, L&M decided to invest in the future and venture into the world of ecommerce.

The website design, development, content management, and internet marketing required to get an ecommerce store of this magnitude off the ground can be overwhelming.  Five Technology worked closely with Jeff Wagner Interactive to put a plan in place that included a realistic feature set and timeline based on budget and resource constraints.

The result is a KCX integrated ecommerce website with annual revenues in the seven figures.  The initial goal was to obtain revenues of 10% of other store locations, but with a growing internet marketing budget those goals have been adjusted accordingly.  The online initiatives for L&M Supply are here to stay and competing to become the most profitable location.

View the Site

Project Challenge

An ecommerce website for a retail store with 10,000+ SKUs presents several challenges:

  • Integration with KCX (supply chain management) for pricing and inventory updates
  • Extended navigation for organization of hundreds of pages
  • Product categories for easy filtering of products within sections of the site
  • Integration with UPS World Ship for tracking # updates
  • Product feeds to Google for PPC campaign
  • Integration with Google Store
  • Process to add inventory to the store

The experienced web development team had their work cut out for them on this project.  Not only will typical project challenges such as usability be a factor, but integration with several with 3rd party systems would be critical to success.

Discovery

The bulk of the discovery phase of this project was spend combing through documentation of 3rd party systems so that we could be confident going into the integration process for each.

KCX is a software package that it used by many retail store chains for point of sale, operations management, distribution, etc.  More on KCX eCommerce.  Every product SKU carried by L&M Supply was located in this system and we had to pull the data for product lines that would be available for purchase online.

UPS World Ship is responsible for the shipping on 75% of the orders place on the commerce site.  With thousands of orders a year, that is a lot of tracking #'s and associated shipping confirmation emails to send to clients.  We needed the two systems to talk so new orders could be imported into UPS and resulting tracking #'s could be sent back and included in shipping confirmation emails.

Google is critical to online success for any ecommerce website, especially if margins are tight on your product lines.  In the case of L&M Supply, we would be integrating with the Google product feed (for PPC campaigns) as well as the Google store.  Google has very stringent requirements, so getting up to speed on the documentation was essential for the integration process.

L&M Supply has 10,000+ SKUs that are organized into hundreds of pages and categories.  Determining how the user was going to easily locate what they are looking for would be critical to online conversions.  A content plan needed to be created early on in the process so that the designer could outline the website flow.

The plan was to have 40% of the SKUs that would eventually be available for purchase online ready for the initial Go Live date.  The rest of the product was to be introduced weekly in the coming weeks, months, years.  A process needed to be laid out for the migration of future product lines, so our system analysis and design team came up with a plan that would work for all involved.

Design

The creative for this project was completed by Jeff Wagner Interactive.  This is not uncommon as often times a company will come to us with an internal team OR a graphic design team they have worked with in the past and love.  In this case Five was actually pulled into the project by Jeff, as our core competency is that of web development.  While we do handle the design phase for the majority of our projects, we are also prepared to work with outside design teams when the opportunity presents itself.

When working with an outside design team it is critical that the line of communication is always open.  We aren't necessarily involved to help make design decisions (although often asked to interject), but are looking to make sure the UX the designer is laying out will not create road blocks in the development process.  For example, if the design on the products details page is asking for related products and the underlying schema does not have that relationship created, the development team will need to know and accommodate for it.

Upon sign-off of the design / UX we are sent the final PSD files and can begin the implementation process.

Implementation

With design files in hand and a full team of web developers ready to roll, it was time to jump into the extensive implementation of this ecommerce site.  As mentioned above in the challenges, there were several complex requirements that had to be overcome on this project.

The programming team had their hands full over the next few months.  An administration dashboard needed to be built so L&M's non-technical content team could start adding inventory to the site.  Data feeds to Google for the product feed as well as the Google Store needed to be set-up to run without human intervention.  Shipping calculations were automated for FedEx, UPS, USPS, Speedy, as well as local freight operations.  Credit card processing was set-up and configured to work with the merchant account.  Finally, functionality required by the UX team such as search, category filters, checkout process, etc. needed to be implemented.  The programming team did what they do best and hunkered down until all tasks were ready for the QA team.

While the programmers worked on the core functionality, the user interface and CMS development teams were getting started on building out the user experience.  The first step was to slice the PSD files into CSS and HTML.  This would give us the code we needed to build out the page as well as product templates.  With a CMS, you build the template once, and then re-use it many times for the same page type.

Navigation was a critical piece that required attention to detail.  We needed the user to be able to find what they were looking for, but at the same time we limit the effort to 2-3 clicks to find what you were looking for.  This was made a reality by creating a main mega navigation that broke into sub-categories on the first click.  Once on a main landing page, we were able to use two category breakdown navigation styles to get the user into the category sections quickly.  Navigation is typically the element that determines if a site has a good user experience or one that needs some attention, so we needed to ensure we didn't miss on this part of the project.

Other important parts of the user experience included things like product details, add to cart process, checkout process, etc.  Elements like product photos, user reviews, detailed descriptions, specifications where applicable, easy to see options, etc. all contribute to the add-to-cart success rate, so attention to detail is required.

Once a customer has added product to the cart, we are at a critical point in the process.  With eCommerce websites you are dealing with sensitive users that are looking for the simplest of reasons to abandon their cart.  We implement small measures each step of the way to confirm to the user they are making a sound decision by purchasing from this honorable and trusted ecommerce store.

After months of development, the user interface team and the programming team were completed with all their initiatives and it was time to call on the QA team.  As you can imagine, this process was time consuming as there were hundreds of pages and thousands of products that had to be tested.  Upon sign-off from L&M, it was time to send this site live and start unloading inventory online.

Results

A state of the art custom eCommerce website was now live for the world to see.  While L&M worked to refine their fulfillment processes when orders did come in, the Five team monitored the analytics to ensure users were interacting with the site as intended.  Putting a well designed ecommerce site out there is step 1, getting customers to find the site and make a purchase is entirely separate.

L&M knew that the organic search engine optimization campaign would take time to produce results, so they decided pay per click (PPC) with Google would be a good way to get things rolling.  This turned out to be a wise decision, as the PPC team over at Spyder Trap is managing this campaign and realizing 200% gains year after year.

The L&M Supply venture into eCommerce is far from finished, but early results have deemed the effort a success thus far.  With a revenue goals of 10% of a brick and mortar store, the online efforts are performing better than anyone could have expected.  The fear of Amazon.com swallowing up their business one customer at a time is always there, but maybe a bit less today than it once was.  Online success is out there for all to have, but those that 100% commit to it (resources and money) are better position to see a return on this investment.

Related Projects