95 lines
3.2 KiB
Markdown
95 lines
3.2 KiB
Markdown
<img
|
|
src="assets/logo/logo-wordmark.png"
|
|
alt="A screenshot of the timeline"
|
|
width="400" />
|
|
|
|
Resin is a Pixelfed client designed to minimize the chance the user will use it
|
|
unhealthily. In other words, this app practices
|
|
[ethical anti-design](https://njms.ca/posts/ethical-anti-design.html). The way
|
|
it does this is by avoiding dark patterns like infinite scrolling and
|
|
putting obstacles in place to minimize the risk of the user taking unhealthy
|
|
actions that are otherwise unavoidable.
|
|
|
|
## Goal
|
|
|
|
The goal of this project is to create a model for what social media could look
|
|
like were it not designed to be addictive. The Fediverse, not being dependent
|
|
on ad revenue, shouldn't need to capitalize on people's attention. Still, many
|
|
of the apps we use to interact with the Fediverse use the same dark patterns
|
|
developed by companies that do. While these dark patterns may seem like industry
|
|
standards, we have no need to follow them. This project seeks to demonstrate
|
|
the different ways to go about doing that.
|
|
|
|
## Screenshots
|
|
|
|
The Resin UI is fully implemented but incomplete; there are some components, like
|
|
the interface for posting new content, that'll be implemented along side the API
|
|
integration. Besides much needed polishing and some consistency improvements, the
|
|
UI likely won't change too drastically from this point forward.
|
|
|
|
<img
|
|
src="assets/screenshots/login.png"
|
|
alt="A screenshot of the login interface"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/feed.png"
|
|
alt="A screenshot of the followers feed"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/comments.png"
|
|
alt="A screenshot of the comments page"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/moderation.png"
|
|
alt="A screenshot of the moderation menu on a post"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/discover.png"
|
|
alt="A screenshot of the discover page"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/search.png"
|
|
alt="A screenshot of the search interface"
|
|
width="200" />
|
|
|
|
<img
|
|
src="assets/screenshots/profile.png"
|
|
alt="A screenshot of the profile page"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/notifications.png"
|
|
alt="A screenshot of the notifications page"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/settings.png"
|
|
alt="A screenshot of the settings page"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/direct-messages.png"
|
|
alt="A screenshot of the list of direct message conversations"
|
|
width="200" />
|
|
<img
|
|
src="assets/screenshots/conversation.png"
|
|
alt="A screenshot of a conversation over direct messaging"
|
|
width="200" />
|
|
|
|
## Building
|
|
|
|
This project is written in React Native and built using Expo.
|
|
|
|
Here are the steps to build it yourself:
|
|
|
|
```
|
|
$ git clone https://github.com/natjms/resin # Clone the repository
|
|
$ npm install # Install the dependencies
|
|
$ expo start # start the development server
|
|
```
|
|
|
|
## Contributing
|
|
|
|
This project is still extremely early in development; however, contributions
|
|
are still more than welcome. If you're interested in helping out, the easiest
|
|
way to get started would be to contact
|
|
[the project maintainer](https://social.njms.ca/nat) who would be more than
|
|
happy to talk to you about it.
|