Assignment 5 Alpha
Deliverables
Completed heuristic evaluation and writeup. A fully working set of components corresponding to one concept in your design. For the milestone, you do not need to worry about styling (i.e., your components may remain entirely unstyled or using the default styles). An attempt at deploying your frontend.
Safety:
The circular relationship of my Post and Collage concept is quite confusing. You have a page of collages, and you can post those collages. You can put collages into collages but only 1 layer deep (i.e. it’s like a parent-child relationship. The “parent” collage can have a “child” collage in it but the “child” collage can not have any collages in it, like a tree data structure of height 1). To prevent users from accidentally violating this relationship I can either:
have an error message appear when the user tries to do an action that would violate this concept.
Have the interface recognized in the event where the user is saving a post if it is a collage inside of a collage, then it can’t be saved into a collage. I realize with either option, I actually need to change my backend to accommodate this edgecase. I like the second option because it stops people from even attempting the mistake, but it may confuse users. So I’d go with the first. Learnability: how rapidly and easily can users understand how to operate the interface?
I think many of the mechanisms are familiar to users from other apps, like adding a post to a collage and joining groups. I think learnability is important particularly when I design the ability to join a collage. Before the previous assignment, I wanted to have an invite system where you send invites to users that they can accept or not. After simplifying my app, I decided to just have a unique link that users can share via Text or smth to join.
there should be a little URL icon on the collages you’re an editor of where if you hover over it says something like “Get invite link” or “Add editors to collage” and when you click it’s a copy pastable url and it says something like “Collage URL Send to a Friend so they can click join! That link is different from the normal link so only people that are invited can join the collage.
A optional tutorial on the app features when the user is first using the app is nice. Which would just be an embed Figma wireframe.
Physical Heuristics
Gestalt principles does the layout of the interface elements convey conceptual structure?
- A post that is a repost will have the original post with the user, group/profile it was shared to, etc in a smaller frame. The borders will have a little repost icon and the user, group, date of the repost, with it’s own comments. When a user reposts a repost, it just reposts the original. This conveys the structure of posts.
Accelerators: what shortcuts does the interface provide to speed up expert users?
Having your favorited groups show first as an option to post to is good.
when saving posts, show collages that are most recently saved to first
maybe when clicking repost first a little box appears with like the top 5 groups you were recently active to and you can select one and it reposts fast. The little box has a see more that opens up the whole post interface again.
same idea for saving things to collages
Linguistic level:
Consistency:
- For collages and groups I will reuse the collage mini icon.
Information Scent:
- Hovering over collages will show a plus icon.
Concept (I'll do the Media one)
DEPLOY LINK https://backend-starter-84z4.vercel.app/
I tried to deploy my front end but it isn't showing up in my projects.
GITHUB LINK