Since 2017, we haven’t added any new templates to the shopping cart solution. It was time to add one!
So here’s the new template— Amsterdam —that we released this spring! We’re very proud of the result. It’s the result of a long process of reflection and a lengthy overhaul of the web application’s
source code to achieve this result.
In fact, some of the templates on www.panierdachat.com are almost 10 years old now! The web is
moving so fast that it’s not uncommon to see some online stores starting to look a bit dated.
Redesigning a new e-commerce template required a lot of effort. First, the way we previously had to program the templates was extremely time-consuming. The cumbersome source code required
weeks of preparation, especially since we felt constrained by the limitations of the current system.
Second, to achieve this, we also had to reprogram part of the web application to provide a
stylish, yet highly performant template.
What a merchant is looking for above all is a visual structure that allows them to be taken seriously
and appear “larger than life” in the eyes of their own customers.
This process was long, almost 2 years, through other developments, and we finally got there.
The tools used
Prototyping
Designing a new online store template at overseas chinese worldwide database is no easy task. Unlike
a custom design, where the needs are very specific, the variety of businesses and sectors in which our
clients do business remains very broad. We therefore had to find compromises to avoid being too
specific, while still being able to deliver a contemporary design that could be used by many online
merchants.
Prototyping tools like Adobe XD , Sketch , and Figma have been available in the design field for a few
years now. For a few months now, we’ve been using the beta version of Adobe XD for prototyping
custom online stores internally. This tool allows us to quickly create a “model template” and then
discuss it with the team.
A design template, as refined as possible
For the new online store template, we from methodologies to workflows wanted to achieve a very
clean design. At the same time, bring a little organic and perhaps a little messy touch to it. (Like the
page displaying a product list). However, we knew that some merchants would prefer a more
traditional approach. So, in discussion with our programming team, we decided to add a page
containing the “template options.” This page would now be used to customize e-commerce templates,
while allowing different design options for the same template. Finally, something so that our e-
commerce merchants could use a template with a different look from their competitors… You
understand?
A stylish template that is (above all) mobile-friendly
Particular attention has been paid burkina Faso business directory to the presentation on mobile
devices. For example, what we see in the traffic statistics is that visitors to our merchants’ online
stores are increasingly on mobile (or even the majority of visits for some merchants!). Precise and
specific mockups have therefore been designed to improve the user experience (UX – User
Experience, a term commonly used in the web). This thus promotes sales for our merchants with a
high percentage of visits coming from mobile browsing.
Photo banks for the online store new-amsterdam-template
To build a complete and understandable visual model for management (who always have to approve
everything!), photo banks are easy-to-access and inexpensive tools. We
chose bigstockphoto.com and istockphoto.com . The two go together, as they say!
The prototype new-amsterdam-template
Finalizing the prototype was still relatively quick. Since we had the approval of management and
programmers, we supplemented everything with stock photos and then presented the final prototype.
Of course, there were some small details that couldn’t be implemented. For example, some texts that,
once programmed, cannot be edited and translated in the template by the client. We must be very
careful about how we name graphic and text elements. Therefore, we must pay particular attention to
ensuring that the template, once programmed, can be used by dozens, even hundreds, of merchants.
New features of the Amsterdam template new-amsterdam-template
First of all, we wanted more. We wanted to do better and especially better than the competition! Since Panierdachat is the only e-commerce solution 100% made in Quebec , we had to push
the machine and surpass ourselves in the objective of results.
Newsletter subscription new-amsterdam-template
Some elements, such as the newsletter pop-up on the homepage, needed to be improved. The design may be more restrictive in terms of use (it requires an ideally square image), but the overall look is much cleaner and the effect is “Wow”!
Quick view of a product sheet new-amsterdam-template
A new feature (yay!) on the Amsterdam template: the “quick view .” This view allows visitors to quickly see the important details displayed in a product sheet, directly on the category page and without having to change pages. The information is clear, precise and allows them to see the full-size image, select an option and add the item to the cart, all while remaining on the same page.