# Website design ideation

...

###### tags: `psych-ux` `ux` `website`

## Questions to consider

- **Who are the target users for the site? What are their goals?**
- How much do they know about eink?
- Huge eink fan
- already own an eink device?
- wanted an eink device but dont own any
- Never heard of eink
-

- **What content will be displayed on the site?**
- What is the group & what is the group's purpose
- What principles are important to the group
- Articles & updates from the group
- How one can contribute/join
- ...

- **What is the priority of content?**
- What should visitors first see?
- What is most important to new visitors?
- What is most important for returning visitors?

- **What are the principles that should apply to the site?**
- (Examples based on call with @tom)
- Use the site as a means to showcase our beliefs about what human-computer interaction can and should feel like; humane approach to design
- e.g., intentional, focused, avoid enagagement hacks, with the aim of helping the user to achieve their goals not our goals
- Simple visual language, prioritize content
- Apply principle of designing for e-ink to the website (e.g. just as usable on an e-ink device as on a traditional device)
- Low use of images, clear contrasts, low use of color, no animation, pagination etc
- Focus on readability
- Minimal design
- Great accessibility
- Use of open-source everything (unless not otherwise possible)

<br/>

----

<br/>

## Practical points
- #### Layout of text
- we need to change font (perhaps scale it to size of screen and amount of zoom)
- we need more spacing between lines to improve readability

- #### Translation of information from github
- Nesting structure of repositories should follow through to website so that we can keep things organised
- tags for articles can link to a certain place
-

<br/>

-----

<br/>

- **Website Examples/Inspiration**
- Substack blogs
- Typeform surveys!
- one thing presented at a time, pagination, use of keyboard shortcuts that are clearly indicated on screen
- http://bettermotherfuckingwebsite.com/
- https://eink.link/index.html
- https://www.textise.net/
- https://bearblog.dev/
- https://www.thelightphone.com/
- https://simpl.fyi/
- https://www.lesswrong.com/
- http://www.paragonday.systems/
- https://www.behance.net/gallery/92385645/UPROCK-NEW-WEBSITE
- https://www.behance.net/gallery/116045443/Credit-Suisse?tracking_source=search_projects_recommended%7Cminimalism%20website

<br/>
<br/>

- **Wireframing**
- [join figma team here](https://www.figma.com/team_invite/redeem/OQyiQHdrq6AyKuYFs5j0vq)