Skip to content

Latest commit

 

History

History
64 lines (32 loc) · 3.56 KB

UX-DESIGN.md

File metadata and controls

64 lines (32 loc) · 3.56 KB

Manga Bookshelf Prototype

Manga Bookshelf Annotations

Home Page

  1. Users will be able to scroll horizontally to view all the trending, recently updated, and "My List" manga.

  2. Under each manga, the name of the manga will be displayed. In the top right corner of each manga, there is a star button for users to add that manga to their favorite list.

  3. Every time a user clicks the Logo, it will bring them back to the home page.

  4. There is also a search button in the header for users to search for manga, and the top-right hamburger menu is for users to visit their profile page.

Home Screen

My Profile

  1. Edit profile button will allow the user to edit their profile, including their profile picture, name, and bio.

  2. Users will be able to add their favorite manga to the favorite section by clicking on the yellow star. In addition, there will be a feature where the users can add and remove the manga that they are currently reading, wanting to read, or finished reading.

  3. By clicking on the follower and the following button, the users can see the profiles that they are following as well as their current followers, similar how instagram implements these features.

My Profile

Other User Profile

  1. Follow user button will allow the user to follow another specific user and add to their following list.

  2. User will be able to view what other users are currently reading, wanting to read, finished reading. User will also be able to add their favorite manga to the favorite section by clicking on the yellow star.

  3. User can view other users' following and followers list by clicking on the follower and following button.

Other User Profile

Manga Info

  1. User can see the profile/information for each manga work on the site in this format. Relevant information include manga title, author, info, and summary.

  2. User will be able to edit last read chapter as they read.

  3. User is able to "star" the work by clicking the star icon on the cover.

  4. Bottom of page will include a forum consisting other users and their messages.

  5. Header works the same way on other pages (logo brings user to home, my list navigates to user profile).

Manga Info

App Map

  1. There are four unique design templates: Home, Your Profile, Other User Profiles, and Manga Info.

  2. The Home is what users will see first when they enter the app.

  3. From the Home, you can view your list directy with the click of a button or use the search bar to find other users to follow or information for various manga titles to track, hence the direct child relationship of the templates.

  4. The number of manga titles is unbounded since there are always new titles coming out, hence the stack in the diagram. This also applies to other user profiles as new users keep creating accounts.

App Map