Mike Bowzeylo of Base2Studio recently completed the beautiful Servings.ca, and we wanted to draw attention to the way that Mike was able to create (in appearance) a very usable and very customized order flow using FoxyCart’s one-page checkout. It’s a gorgeous site, and is using FoxyCart in one of the more interesting checkout flows we’ve seen.
Some notes (mostly Mike’s own notes he supplied us with) are below.
servings + foxycart
technical & procedural overview
Servings’ website offered a unique challenge in developing an eCommerce solution since they really only have 1 product, however it’s price can vary significantly. Price isn’t set like “Item A = $29.99”, rather, the final price is calculated based upon several factors chosen by the user at the time the order is placed.
User choices include the following, most of which affect the final price of the order:
- What type of session are they booking
- Pickup Session
- Assembly Session
- How many meals do they want to prepare
- 6 Meals
- 12 Meals
- How many servings of each meal do they want to prepare
- 2-3 servings
- 4-6 servings
- User picks a date to come in and assemble or pickup their meals.
- User picks their menu items
- User chooses to add soup and/or dessert
- An appropriate session date has been chosen
- The user has chosen the correct amount of menu items based on the meal count they picked earlier.
- How many additional soup and/or dessert items have been added
The script now calculates, and sets, the final order price just before the checkout page is called.
Servings.ca has also used the FoxyCart attribute
empty=true to ensure that the checkout page only ever contains the current order. This is useful if a user goes back to change some menu items on their order.
In the end FoxyCart’s ecommerce platform was a powerful yet simple system to integrate into Servings’ website. This let Mike spend more time focusing on actual development rather than system integration. The client was thrilled that their site had a consistent look and feel from start to finish, so it’s a win-win-win!