Skip to main content

User Interface

What are the most important elements of the app's user interface?

  • Initial discussion: 5 min.
  • Extended discussion: 30 min.
Tips
  • Keep it simple! Verbal is ok, we're not designing the full UI here.
  • This is for initial discussions only, to get app highlights.
  • Avoid getting sidetracked on granular UI details.
  • If there are mockup designs, use them, but verbally validate UI buttons.
Example banner

Interface examples​

Uber-like Ridesharing app user interface​

  1. Home button/icon:
    • takes the user to the main screen of the app where they can request a ride.
  2. Current Location button/icon:
    • allows the user to quickly set their current location as their pickup location.
  3. Search button/icon:
    • allows the user to search for a specific address or location to set as their pickup or destination.
  4. Ride types button/icon:
    • allows the user to select from different ride options, such as UberX, UberPOOL, UberBLACK, etc.
  5. Payment button/icon:
    • allows the user to manage their payment options and see their transaction history.
  6. Promotions button/icon:
    • allows the user to view and redeem any promotions or discounts they have available.
  7. Profile button/icon:
    • allows the user to access their account settings, view their past trips, and manage their preferences.
  8. Help button/icon:
    • allows the user to access the app's help center, FAQs, and contact information.
  9. Settings button/icon:
    • allows the user to access the app's settings and customize their preferences.
  10. Share button/icon:
    • allows the user to share the app with friends and invite them to join and use the app.

Food delivery app (like Uber Eats) user interface​

  1. Home button/icon: takes the user to the main screen of the app where they can browse restaurants and place orders.
  2. Search button/icon: allows the user to search for specific restaurants, dishes, or cuisines.
  3. Order history button/icon: allows the user to view and manage their past orders and reorder easily.
  4. Cart button/icon: allows the user to view and manage items in their cart, and proceed to checkout.
  5. Payment button/icon: allows the user to manage their payment options and see their transaction history.
  6. Promotions button/icon: allows the user to view and redeem any promotions or discounts they have available.
  7. Profile button/icon: allows the user to access their account settings, view their past orders, and manage their preferences.
  8. Help button/icon: allows the user to access the app's help center, FAQs, and contact information.
  9. Settings button/icon: allows the user to access the app's settings and customize their preferences.
  10. Share button/icon: allows the user to share the app with friends and invite them to join and use the app.
  11. Note: the icons or buttons may vary depending on the app design and implementation, these are common features that can be found on most food delivery apps.

Extended meeting​

The basic UI walkthroughs above are intended as a small part of a very brief request for info initial meeting.

If you have more time, you can ask additiol questions such as below.

UI questions to ask​

These are some good questions for a more extended UI meeting:

  • User research and feedback:
    • What user research has been conducted and what feedback has been received?
    • How will this information inform the design of the user interface?
    • Do you have any of the materials that I can see? (survey/results)
    • Who has research responsibility?
  • Navigation and organization:
    • How will the app be organized and how will users navigate through it?
    • How firm are the current navigation ideas?
    • Are you using a particular template, framework or app as a pattern?
  • Interaction design:
    • How will the user interact with the app, including gestures, touch, and other input methods?
  • Visual design:
    • How will the app look and feel, including color scheme, typography, and other visual elements?
    • Is there a branding guide?
      • If so, please email it to me.
      • If not, who will be doing that?
    • Who has branding/design responsibility?
  • Accessibility:
    • How will the app accommodate users with disabilities and ensure compliance with accessibility standards?
    • Who is responsible for mandating accessibility standards?
  • User testing:
    • How will the app be tested with users to ensure it meets their needs and expectations?
  • Technical constraints:
    • What are the technical constraints of the app, such as platform and device requirements, and how will these impact the user interface design?
  • Iteration: How will the design be iterated and improved over time based on user feedback and testing.
  • Timeframe and milestones:
    • What is the project schedule and what are the key milestones for the user interface design?
  • Internationalization and localization:
    • How will the app support multiple languages and cultures, and adapt to different regions?
  • Branding and identity:
    • How will the app align with the overall brand and visual identity of the company or product?
  • Error handling and feedback:
    • How will the app handle errors and provide feedback to the user in a clear and user-friendly way?
  • Data visualization:
    • How will the app display and present data to the user in a clear and meaningful way?
  • Notifications and alerts:
    • How will the app communicate important information to the user through notifications and alerts?
  • Security and privacy:
    • How will the app protect user data and ensure compliance with security and privacy regulations?
  • Device scalability:
    • How will the design of the app scale to different screen sizes and resolutions, and across different devices?