Skip to main content

The Scenarios

App Specification​

The solutions architect summarizes the requirements briefly:

  • 3 user types: Guests, New Hires and HR Admins
  • 3 content types: Listings, Blog Posts, User Activities
  • 3 user interfaces: Portal UI, Blog UI and Admin UI

The use case is ideally implemented by a modern full-stack application with multiple front-ends talking to a content management system and related service integrations on the backend through a common API. For convenience, let's label the apps (UI/UX):

  • Admin App: is the core UI/UX for HR Admins, putting content management in focus.
  • Portal App: is the primary UI/UX for New Hires, putting rental listings in focus.
  • Blog App: is the secondary UI/UX for New Hires, discoverable from the Portal App.

Where user roles are tied to the relevant app:

  • HR Admins are authenticated users on Admin app.
  • New Hires are authenticated users on Portal app.
  • Guests are anonymous users that can only see Blog and Portal apps.

By definition, Guest roles can login on the Portal App to get upgraded to New User roles. And New User roles are downgraded to Guest access when they log out.

User Scenarios​

We can now convert the broad application scenario into specific user scenarios:

1. HR Admin Role​

HR Admins can login on the Admin App
  1. and create property listings with location, amenities, price
  2. and update, delete, or view current rental listings
  3. and toggle feature flag on a listing to feature it
  4. and create blog posts with title, images, content
  5. and update portal content seen on about, tos, home pages.
HR Admins can't login on the Portal App
  • HR Admins credentials for Admin App should not work on Portal App.
  • HR Admin can visit the Portal App anonymously, as a Guest.

2. Guest Role​

Guests can visit the Portal App
  1. and see the Home page as their landing or entry point
  2. and see navbar, footer and content sections on Home page
  3. and see a clickable login button in the navbar
  4. and see clickable About, TOS, Home links in footer
  5. and see a "hero banner" in content section of Home page
  6. and see a clickable visit blog button in the hero banner
  7. and see a clickable "search" button in content section of Home page
  8. and see a "featured" listings block in content section of Home page
  9. and see a clickable listing image for each item in the featured listings
Guests on the Portal App "Home" page
  1. can click the login button to start authentication workflow
  2. can click About, TOS, Home links to visit those pages (routes)
  3. can click the search button to visit the search page to make queries
  4. can click the blog link to visit the Blog App
  5. can click a featured listing image to visit the listing details page
Guests on the Portal App "Listing Details" page
  1. can see related listing images
  2. can see related listing details (location, description, amenities)
  3. can see a listing reservation section (not enabled for input)
  4. can see the same navbar and footer sections as Home page
  5. can click the navbar login button to start authentication workflow
  6. can click About, TOS, Home links to visit those pages (routes)
Guests can visit the Blog App page
  1. can see the same navbar and footer as the Portal App
  2. can see a list of tags for exploring blog posts
  3. can see a list of currently published blog posts
  4. can see a link to return to Portal App page
  5. can click on a blog post in listing to visit Blog Article page.

3. New Hire Role​

New Hires can login on the Portal App
  1. and get all default Guest features except for the login button in navbar
  2. and now see a clickable Profile button in navbar
  3. and now see a clickable Favorite toggle button on listing cards in Home page
  4. and now see a clickable Favorite toggle button in Listing Detail page
  5. and now see a editable Reservation form section in Listing Detail page
  6. and now see a clickable Reserve button in Reservation form section
  7. and can click Profile button to see a dropdown menu with
    • a clickable Profile item leading to the user's profile page
    • a clickable Favorites item leading to the user's saved listings
    • a clickable Reservations item leading to the user's reservations
    • a clickable Payments item leading to the user's payments history
    • a clickable Logout item that logs user out (returns to Guest role)
  8. and can edit Reservation form details (dates) and click to submit request
New Hires can't login on the Admin App
  • New Hires should not see any links to Admin App in Portal App
  • New Hire credentials for Portal App should not work for Admin App

Now that we have our core scenarios identified, its time to design the architecture!