DATE:
AUTHOR:
Product Team @ Bite

UI/UX v2 Improvements for Usability

DATE:
AUTHOR: Product Team @ Bite

To enhance usability and streamline the ordering experience, we’ve implemented a series of UI/UX improvements focused on clarity, intuitiveness, and efficiency. These updates refine key interactions, ensuring a more seamless ordering experience. From optimizing menu toggles and keyboard functionality to refining pricing displays and modifier selections, every change is designed to reduce friction and enhance visual feedback. These refinements create a more user-friendly and efficient ordering process, making it easier for guests to interact with the kiosks. These changes will be released to all current UI/UX v2 ("Vitrine") locations in the next week.

  • The Dining Option toggle at the top of the menu has been updated from text to icons to accommodate multiple languages, as the translations for "To Go" and "Dine In" are often too long to fit within the available space.

  • Additionally, the positions of the Exit and Rewards buttons have been swapped to improve usability, aligning with common design patterns where “Back” and “Cancel” actions are typically placed on the top left.

  • The keyboard has been enhanced with improved color contrast on the Shift and Backspace keys to reduce accidental taps and improve usability.

  • A cursor animation has been added to the center of input fields to indicate when they are active, eliminating user confusion and removing the need to tap on the field to focus.

  • For name input fields, the first character will automatically be capitalized by defaulting the Shift key to "on," reducing unnecessary taps.

  • Compound items now display a price range instead of listing each individual price option, ensuring a cleaner, more uniform presentation.

  • Selected modifiers will now be filled in using designated brand colors to clearly indicate selection, reducing user confusion.

  • The loyalty login screen has been updated to a top-bar toggle style for switching between authentication methods (QR code, phone number, etc.). This change ensures consistency with most action buttons being placed at the bottom, providing a smoother ordering flow for both the users who choose to bypass the loyalty screen and the users who choose to log in.

  • Additionally, the Sign-Up button has been moved to the center of the screen, positioning it closer to the loyalty banner for better visibility and encouraging new sign-ups. This separation also distinguishes the sign-up action from the primary login or guest checkout flow.

  • The "View" and "Add Item" buttons in the menu view are now displayed side by side to provide clearer functionality. This layout helps users quickly understand that they can either add an item directly to the cart or view it for customization, supporting potential upsell opportunities.

  • The "View" button text is also customizable, allowing businesses to tailor it to different labels such as "Customize" or "Edit" based on their preferences.

  • Additionally, quick add from the menu view can be disabled, and its eligibility is fully customizable at the location level based on the following conditions:

    1. The item has no modifier groups.

    2. The item has modifier groups but no mandatory choices that require user input.

    3. The item has mandatory modifier groups, but these selections have already been pre-configured on the POS or in the Bite Admin Portal.

These updates offer greater flexibility while ensuring a smooth and intuitive ordering experience.

Powered by LaunchNotes