Create mockups of homepage

[heykc]

Description

Design some mockups to visualize the style and structure of the homepage of our site.

Subtask of

2 - As a user I want to view a list of chain letters

Acceptance Criteria:

• [ ] should include basic nav
  • [ ] Title
  • [ ] home link
  • [ ] about link
  • [ ] login/ sign up link
• [ ] list of first-link stories

[heykc]

If someone wants to work on this, let me know. I can take some time to discuss the overall flow of the site in more detail to help you come up with some ideas for the design.

[KevinW90]

There is a Figma file with some designs for the homepage. You can add comments on specific elements. I'd love to hear feedback and suggestions for what can be improved upon. Please give a reason for your suggestions as well.

Keep in mind they are lo-fi grey-box wireframe mock-ups.

[heykc]

Looks good. I think Screen 3 had the most promise. Next steps should be as follows:

• [ ] come up with a few mocks of card layout using the data info we discussed
  • story title
  • story content
  • author name
  • author image
  • total children
  • overall chain rating
  • view story button
• [ ] screens with the card layouts repeated
• [ ] provide some color variation in next mockups

[KevinW90]

3 Card layouts have been chosen from 11 made. Desktop (1440x1024) and mobile (375x812) screens tile those 3 designs. Red (#ff0000) is the current accent color. Secondary action color is a lite-grey (#ebebeb) Mockup status has changed to being logged in. Might change the author name to red (primary) to relay clickability. Might have the menu icon (hamburger) on mobile be in a lite-grey (secondary) box with rounded corners (border-radius).

[KevinW90]

Thanks for the comments on the Figma file @heykc. I did some revisions based on those. There is a new frame in Card Tiling with some new card designs and a layout concept. Please view the Figma file and leave some comments.