The end user experience | SRBG_006
SW

Sam Webster

Created Sep 06, 2023

The end user experience | SRBG_006

In this tutorial, we'll take a look at the end user experience.

Although we've sort of covered this in the previous tutorials as we've been performing other tasks, this section will purely focus on the end user experience of your Storefront.

30
1

Create a new user

Begin logged in as your Storefront administrator. Create a new user (only an email address and 6+ character password is required), ensuring they have no Customer Roles other than the standard Registered role.

This will mimic the roles the majority of your registered users are likely to have.

Create a new user
2

Click on Impersonate

Click Impersonate to view your Storefront as they would.

You will be taken to the home page, where you will be able to interact with the front-end as if they had logged in.

Click on Impersonate
3

Home Page

Your home page displays. As you are impersonating a registered user, you will not have the Admin button available on the top right.

You will, however, see a character icon indicating you are currently Impersonating this user.

Hovering over the My Account dropdown list will also give you the ability to Finish Impersonation.

Home Page
4

Navigate the Storefront

Select, configure and add different products to your basket. We have created a significant selection of differing scenarios to experiment with. Such as:

  • Stock type products

  • Static PDF type products

  • MegaEdit type products

  • Categories available on the home page

  • Products available on the home page

  • Products available through the search feature

  • Adding different quantities of product

  • Configuring products via MegaEdit

Once you have investigated these possibilities, head to your basket where you will see details of your work.

Further changes can be made from within the basket, such as deletion and quantity amendment.

Navigate the Storefront
5

Click on checkout to begin the One Page Checkout procedure

Click on checkout to begin the One Page Checkout procedure
6

Enter address details

This new user will not have any registered addresses.

Enter Billing address details to continue with checkout. A check box is available at the bottom of this section to also use this address as the delivery address.

Once input this once, the address will be saved to the users account for future use.

Enter address details
7

Click on Continue

Click on Continue
8

Select a delivery option

The next stage of the checkout process is the delivery option.

We have specified several fixed rate delivery options which are now displayed for the user to select between.

Select a delivery option
9

Click on Continue

Click on Continue
10

Input payment information

Our rapid build Storefront utilises purchase orders as the only payment type.

As we have set this to mandatory, the user MUST specify a value before continuing.

Input payment information
11

Click on Continue

Click on Continue
12

Order summary

The final stage of the one page checkout process is to review the order summary. This will show you details of the order content, plus details on pricing, taxes, etc.

Order summary
13

Order summary

Order summary
14

Click on Confirm

This will place the order in the Infigo system

Click on Confirm
15

Order confirmation

Once the order has been placed, the user is presented with an order confirmation screen.

Order confirmation
16

Click on Click here for order details.

Click on Click here for order details.
17

Order details

Details of every order placed by the user are visible in their My Account area under My Orders.

These pages will show all details associated with that order, including information such as due date and status, should the Storefront administrator wish that information to be available to users.

Order details
18

Click on Orders

Click on Orders
19

Click on Click Here To Show/Hide Order Details

Click on Click Here To Show/Hide Order Details
Well done!
Create how-to guides like this in a snap. Get Tango now.