--- title: "Virtual Consultations" canonical: "https://red-ant-documentation.refined.site/space/RET/114556979/Virtual%20Consultations" format: markdown --- ## Journey overview This guide describes the core journey taken by both the user and customer when carrying out a virtual consultation, providing an outline of functionality on key screens as well as helpful tips for getting the best experience out of this feature. Note that virtual consultations require an integration with Appointedd in order to generate Zoom links which are used in parallel with our platform. Click [here](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/24543234/Appointedd+Consultations) for more information on getting set up with Appointedd. ![image](media://fd1594c6-cf2a-4bc0-bc28-3a15a60894e0) ## Video walkthrough Below is a complete walkthrough of the virtual consultation journey from both the user (left) and customer (right) point of views within the RetailOS platform, from the customer receiving the email and confirming their appointment to submitting payment and completing the consultation. ![image](media://db19a1b1-931e-4835-91cc-ba629c3f426f) --- ### 1. Starting a virtual consultation from the dashboard When it’s time for a virtual consultation to take place, it can be initiated from the consultations dashboard by selecting the ‘start now’ CTA. Note that this CTA only appears for consultations taking place that day, it does not appear for any upcoming consultations taking place from tomorrow onwards. Once a consultation has been started by a user and is in progress, this is indicated on the consultation dashboard by the green ‘in progress’ CTA that’s displayed on the right-hand side. IMPORTANT: It is possible to join an in progress consultation as the user, however it is very important to note that this will **remove the current user from the session**. Users should only proceed if they are looking to re-join a consultation which they were hosting themselves (which they may have accidentally left) or are taking over from another user. --- ### 2. Connecting to a virtual consultation #### As the user Upon starting the virtual consultation, the user will be taken to the main consultation page where the majority of the consultation will take place. On the top right-hand side, users will see: - An indication of whether their customer has joined the consultation * - The date and time of the consultation - A ‘join video’ CTA (more on this further down) - A ‘customer link’ CTA - this allows the user to copy and share the joining link that is sent to the customer via email, if for whatever reason they do not receive it Below this is the customer side profile, which allows the user to access the customer’s full profile, as well as update key customer preferences during the consultation. ![image](media://bef8aad3-8f28-455f-8480-966e6e0930a2) On this screen the user will also see a section where products can be added and displayed, as well as CTAs at the bottom of the screen, both of which are covered further below. #### As the customer ![image](media://37f3b4f6-5ad7-472b-9cba-8c1c0788fc66) When a customer books an appointment, they will receive an automatic email sent from Appointedd containing a link to their consultation. When it’s time for the customer to join their virtual consultation, they will click on the link in the email and be taken to a consultation landing page. Similar to the user, the customer will see: - An indication of whether the user (consultant) has joined the consultation * - The date and time of the consultation - A ‘join video’ CTA (more on this further down) - Instructions on how to join via Zoom and how to utilise the consultation web page - Consultation tips to ensure they have the best experience | **Top tips** | | --- | | * There is a known limitation whereby the user / customer status only indicates if either party has joined the consultation platform, not whether they have joined Zoom. This is also only registered once, so if the customer accesses the link prior to the consultation time & date but then leaves, their status will continue to appear as having joined to the user thereafter. | #### Joining Zoom In order to see and hear each other, both the user and customer will need to select the ‘join video’ CTA which will launch their Zoom app separately, and will allow them to connect to each other via video. In order to ensure both user and customer can connect as easily as possible, in that both global and user accounts have the ‘waiting room’ functionality turned off and have set the option to allow participants to join at anytime. For further information on Zoom setup, click [here](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/24543234/Appointedd+Consultations) and see further below for recommended devices. --- ### 3. Adding products to the consultation The user can add products to the consultation by selecting the grey ‘+ Add product’ box, this will load the product catalogue. This will display the usual product catalogue, with the only difference being that the user will not be able to access the product detail page (PDP) from the product listing page (PLP). This is because the journey within a virtual consultation needs to be limited to prevent potential issues. In addition to the usual product catalogue functionality, from the PLP users can: - Select to add a product to the consultation - See the cost of a product (a minimum cost is displayed if that product has multiple variants) - See the number of product variants available - Select one or more product variants via the dropdown (dropdown only appears if a product has more than one variant) - See an indication of the products / variants they have selected - Deselect products to remove them from the consultation (for variants simply select the highlighted item to deselect it) ![image](media://d1cf0de0-967a-4ae9-8cd9-b1d690470007) Once the user has selected the products they would like to add to the consultation, they should select the ‘done’ CTA at the bottom of the screen which will take them back to the main consultation screen. --- ### 4. Presenting & interacting with products Back on the main consultation screen with products now added, the user can present these to the customer and start to build the mutual basket. #### As the user From this screen users can: - Select anywhere on a product component to make it ‘active’, indicated by the green lozenge - this displays it to the customer on their screen (see further below) * - Select the heart icon to add a product to the customer’s wishlist - Select the information ‘i' icon to view a product’s full details - Add or remove a product to / from the customer’s basket ** - Edit the quantity of each product in the basket *** - Select the bin icon to remove a product from the consultation ![image](media://070e7f8d-6fc2-48c2-8bcf-a2f7f7359558) When the customer is ready to finalise their basket, the user can select the ‘review’ CTA at the bottom of the screen to move onto the next step (see below). #### As the customer ![image](media://429004a6-244f-43b0-bc19-41f5ecbaaed8) When a product is made ‘active’ by the user this displays it on the customer’s side, each time the user switches the ‘active’ product this is displayed to the customer. If there is no ‘active’ item selected, the customer will be displayed the landing page by default on mobile. On desktop the landing page will always be visible on the left-hand side even when a product is made ‘active’, see screenshot below. Whilst a product is ‘active’ on their screen, the customer will be able to: - See all relevant product information - Add or remove a product to / from their basket ** - Add or remove a product to / from their wishlist ![image](media://9c79cd20-e755-4f07-96b6-8637c08e4c76) | **Top tips** | | --- | | * Only one product can be made ‘active’ at a time - switching between products to render them ‘active’ will display them in turn to the customer, so it is recommended to do this slowly so that the customer has time to view the information. | | ** When a product is added to or removed from the basket by either participant, this updates the status of that item for the other participant. | | *** The quantity dropdown indicates how many of that item is in the basket, i.e. if there is a quantity of 1 currently selected then this is changed to a quantity of 4, there will be 4 of that item in the basket | --- ### 5. Reviewing the basket This step sees the control of the basket handed over to the customer, allowing them to edit their basket to their liking prior to checking out. #### As the user The user will see two tabs: - Products used - this displays all of the products that have been added to the consultation - Basket - this displays the products added to the customer’s basket and will update in real-time as the customer finalises the products they’d like to purchase ![image](media://7a0daebf-71c6-4138-a23d-dcf3acc44545) This screen is predominantly read-only for the user, to avoid any conflicts or confusion that may occur if the basket is being updated on both sides. The only action a user may take is to add items to the customer’s wishlist. The user can select ‘back’ at the top left of the screen to go back to the main consultation screen, or select ‘checkout’ at the bottom of the screen to proceed to checkout (see further below). #### As the customer ![image](media://bfc3ab4c-d068-459c-b582-4bc4c19d93ca) This is the stage at which the customer has full control over building their basket, allowing them to: - See a list of all of the products added to the consultation - See the total number of products in their basket and the total cost - Add or remove products from the basket - Edit the quantity of a product in their basket * - Add or remove a product to / from their wishlist | **Top tips** | | --- | | * In the same way as the user view, the quantity dropdown indicates how many of that item is in the basket, i.e. if there is a quantity of 1 currently selected then this is changed to a quantity of 4, there will be 4 of that item in the basket | If the customer would like to make a purchase and has selected the products in question, the user can start the checkout process (see below). Alternatively, if the customer does not wish to make a purchase, the consultation can be ended at any time (see step 7). --- ### 6. Checking out Checkout is largely custom per client but there is out of the box functionality setup in core that can be used as standard. It will need to be agreed with the client how stock check and order fulfilment will take place so that this can be considered as part of the checkout flow. #### As the user During checkout the user is responsible for: - Selecting the appropriate deliver method - Entering the customer’s details * - Entering the customer’s address ** - Adding any discounts or editing the unit price - Making any final changes to the basket contents & quantities ![image](media://1535d5e9-96f1-4414-8f88-d039973da677) ![image](media://f939269f-618f-40ec-95b4-7fb956781345) At the bottom of the screen is a breakdown of the costs, along with the final total cost. Upon selecting ‘continue’ the user will have the opportunity to verify all the details are correct before moving on. If the customer would like to make further changes to their basket, or changes their mind about purchasing, they can go back to the previous screen by selecting the ‘back’ CTA at the top left. #### As the customer ![image](media://6809e524-a3f6-455c-a7c1-82096e82bca3) At this stage, the customer will see an indication that checkout is currently in progress by way of a loading spinner at the top of their screen. They will see a summary of the items they are purchasing, and whilst they will no longer be able to amend their basket they can still add items to their wishlist if needed. As the basket is updated by the user they will see discounts and delivery costs reflected on their screen. #### Checkout options After selecting to continue, the user will be presented with the checkout options that have been set up specific to that client, such as: - Payment integration via [Stripe](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/400326705), [Klarna](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/404946981), Adyen (or similar) - This triggers the payment platform’s interface to appear on the customer’s screen in real-time - The order will be assigned ‘awaiting payment’ status until payment is complete which is visible to the user on their screen - The customer can then securely enter their card details and complete payment - If payment is successful the customer will receive an e-receipt and the user will see the status ‘complete’ on their screen - Pay by link via [Stripe](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/399081496) (or similar) - This triggers an email to the customer to complete payment on their own device - The order will be assigned ‘awaiting payment’ status until payment is complete - Upon selecting the link in their email the customer will be taken to a unique payment portal page for their order where they can enter their card details and complete payment - If payment is successful the customer will receive an e-receipt and the order will be updated to ‘complete' in the RetailOS system - [Save transaction](https://redantdigital.atlassian.net/wiki/spaces/RET/pages/406716433) - This can be used where payment integration is not available and users complete payment on a separate system In either case, once the relevant checkout method has taken place, both the user and customer will be taken to the consultation complete screen (see step 8). | **Top tips** | | --- | | * Any information that is already populated in the customer’s profile will be pre-populated in these fields, it is recommended to check with the customer that these are the details they would like to use for this order. | | ** The customer’s address can be entered manually or using address lookup which will pre-populate the relevant fields - if needed the customer can send their address using Zoom’s chat functionality to ensure no details are entered incorrectly. | --- ### 7. Ending the consultation without payment If at any point the customer wishes to end the consultation or does not wish to make a purchase at this time, the user can select the ‘end consultation’ CTA from the main consultation screen which will essentially ‘complete’ the consultation flow. Once the consultation has been completed it will not be possible for the user to go back and add products to the consultation, the customer will need to re-book another appointment. Note that ending the consultation will not disconnect the parties from Zoom, it will simply skip the review and checkout process and take both parties to the next screen (below). --- ### 8. Consultation summary Upon either ending the consultation without a purchase or completing checkout, the user and customer will be taken to the consultation summary screen. #### As the user On this screen the user will see the following information: - Customer details - Delivery method (if checkout took place) - Order status (awaiting payment or complete) - Summary of products purchased & total cost - An option to copy the payment link (if pay by link was the chosen payment method) ![image](media://7499b267-69ed-44da-b8a0-62c984ba445f) As mentioned if there has been payment requested of the customer, the ‘order status’ will update depending on when the payment takes place. For example if using a payment platform that allows the customer to pay in real-time during the consultation, the user will see the order status update to ‘complete’ whilst they are on this screen. #### As the customer ![image](media://a54614dc-318a-4103-9c88-9b07cc572577) On this screen the customer will see some copy informing them that their consultation is complete, along with the following: - Consultation feedback request - this allows the customer to select a star rating as to how they felt their consultation went - Summary of products purchased & total cost The consultation feedback is sent in the form of an email and can be sent to any designated email inbox. --- ### 9. Leaving the consultation When both parties are ready, they can navigate back to their Zoom app and leave the Zoom meeting to disconnect from video. The customer can then simply close the consultation tab / window and the user should select ‘leave consultation’ to return to the consultations dashboard. --- ## Consultation emails RetailOS has OOTB consultation summary emails setup that are sent to a customer post-consultation, regardless of whether a purchase was made or not. This provides a summary to the customer of the products used / purchased during their consultation. These emails can be switched on or off or customised based on client requirements. --- ## Device & set-up recommendations Virtual consultations can be carried out on the majority of recent devices and software versions from both a user and customer point-of-view. However as the Zoom app is used alongside our platform for this feature, Red Ant has found that certain devices and configurations lend themselves better to the overall retailer experience. **User:** Red Ant recommends using the web app on a Mac or Windows desktop computer (with web cam) for overall ease of use, as well as allowing split screen between the Zoom app and the RetailOS platform so that the customer is always visible whilst the user interacts with the platform. It is also possible to split screen on newer iPads and conduct consultations in landscape mode. **Customer: **there is no specific device recommendation however it should be noted that on recent mobile devices & tablets picture-in-picture is available to allow the user’s video to always be visible on screen whilst the browser it at the forefront. Note that this is not always supported on older devices or software versions. ### RetailOS device / browser support | | **Chrome** | **Safari** | **Edge** | **Firefox** | | --- | --- | --- | --- | --- | | **iOS** | ✔️ | ✔️ | ✔️ | ✔️ | | **Android** | ✔️ | - | ✔️ | ✔️ | | **macOS** | ✔️ | ✔️ | ✔️ | ✔️ | | **Windows** | ✔️ | - | ✔️ | ✔️ | ##### Full list of tested devices: ###### iPhone 7 Plus iPhone 8 iPhone XR iPhone 11 Pro iPhone 12 Pro iPhone 13 iPad Gen 9 Samsung S10e Samsung S21 Ultra Google Pixel 5 Google Pixel 2XL Lenovo Ideapad 520S MacBook Air ### Zoom system requirements Mobile: [https://support.zoom.us/hc/en-us/articles/201179966-Zoom-system-requirements-iOS-iPadOS-and-Android](https://support.zoom.us/hc/en-us/articles/201179966-Zoom-system-requirements-iOS-iPadOS-and-Android) Desktop: [https://support.zoom.us/hc/en-us/articles/201362023-Zoom-system-requirements-Windows-macOS-Linux](https://support.zoom.us/hc/en-us/articles/201362023-Zoom-system-requirements-Windows-macOS-Linux)