Skip to content

A5 Alpha: Frontend Milestone

Heuristic Evaluation

Wireframe: https://www.figma.com/file/F9F6GshDa9VXj6otap5Cek/kah?type=design&node-id=0%3A1&mode=design&t=27s6xCEmKjcYSacI-1

Heuristic Value Observation:

  • The desktop UI has a lot of white space, all interactive buttons are located in a mobile interface size square in the center of the screen. This minimizes the amount of movement the mouse needs to make. (Physical Heuristic > Fitt's Law)
  • Functionalities are hidden away into many seperate pop-up windows such that the main pages have few words/options/information, for simplicity for the eyes. Calm technology. Even the schedules only show events on the next three days, rather than the entire calendar month. (Usability > Pleasantness)
  • Most features are similar to Instagram. It should be easy to learn for most young users of social media, and also because the feed sets the standard of what posts should look like, users can learn from each other. (Usability > Efficiency)
  • The main pages are divided on the bottom navigation bar. Users can click on only of four options to be the root of their session experience, thus its pretty simple to remember how they got to their current location. (Physical Heuristic > Situational context)
  • The explore feature, followers, and tag concepts are how users might forage for information. However, its not clear if the tags in the explore feature are additive in an intersection or union way. Additionally not clear how the limitations hidden in the manual settings would be made clear to users on the explore page why their queries are not returning items outside of their manually set ranges. (Linguistic Level > Information scent)
  • Similarly, users might have to remember certain combinations of their explore settings to get their personal balance of direct/global dance inspiration. (Linguistic Level > Recognition vs. recall)

Concept and Component Development

https://github.com/lvcyklm02/frontend-starter

I implemented the front-end for the comment concept.

Frontend Deployment

Deployment: https://vercel.com/lvcyklm02s-projects/frontend-starter/76TBQHTHGG9ScE5LKpxfzziTMQX2

Links: https://frontend-starter-kappa.vercel.app/https://frontend-starter-git-main-lvcyklm02s-projects.vercel.app/https://frontend-starter-izysgmzy1-lvcyklm02s-projects.vercel.app/