Projects

Graphic Design

Contact

Website Idea: ‘mydiary’

Website Idea: ‘mydiary’

mydiary is a website aimed towards feminine-presenting individuals interested in social media and involves customization to create a safe space for users.

mydiary Project Thumbnail Laptop Mockup

Project Overview

Project Overview

For this project, I was tasked with creating a project of my choice. Reminiscent of old 2000s virtual worlds and a mixture of modern-day social media, I decided to create a feminine-oriented website through Figma.

Duration: 1 month

The Problem

The Problem

Compared to the earlier years of the internet, social media lacks customization and has more of a broad approach to its audience reach allowing for many types of different people to join. The broad reach of these platforms is great, but what if feminine-oriented individuals had a space and corner of the internet of their own? A place where those can feel safe around people similar to them. Through a survey of feminine-presenting women, I was able to look into the areas of their in-person and internet lives and discover what makes them uncomfortable:

Lack of safe space
Judgment of appearance and personality
Male-presenting figures taking over
Poor mental health
Lack of safe space
Male-presenting figures taking over
Judgment of appearance and personality
Poor mental health

The Goal

To solve the following problems, the website will focus on providing a space for the users to voice themselves without regret and feelings of judgment. The overall goal of the platform is to provide a space for the users to express themselves and make it feel like a second home.

Design Process

Design Process

The first step was defining what a safe space was for the target audience. I sent out a survey with some questions about environments the potential users feel safe in and their social media habits.

Pie Chart of Design Process Research Question, "What's your favorite thing to do on social media?"
Open ended response of Design Process Research Question, "How would you define a safe space?"
Pie Chart of Design Process Research Question, "How likely are you to engage in conversation with strangers?"
Open ended response research question "Is there an environment you feel safe in? If so, list this environment."
Pie Chart of Design Process Research Question, "What's your favorite thing to do on social media?"
Pie Chart of Design Process Research Question, "How likely are you to engage in conversation with strangers?"
Open ended response of Design Process Research Question, "How would you define a safe space?"
Open ended response research question "Is there an environment you feel safe in? If so, list this environment."

Based on these results, I concluded some of the important features of the website that could benefit potential users.



Users will be allowed to manage their accounts with the freedom they please.

Based on these results, I concluded some of the important features of the website that could benefit potential users.

Users will be allowed to manage their accounts with the freedom they please.

  • View Posts: users will be allowed to post photos and writings that others can view

  • Newsletter: users can create their blog posts to share with others

  • Messaging: users can message and friend request others to talk to them privately

  • Private Notes (Diary): users can write in a private diary on their account filled with their thoughts that they could share if desired

User Flow

User Flow

User flows are created to ensure the website is easily navigable from sign-up, website features, and logout.

User flow for website navigability, website features, and logout

Design System

Design System

This design system compromises the logo, typography, colors, and icons used throughout the design

'mydiary' design system including typography, logo, color palette, and main interface

Wireframes

Wireframes

These are the wireframes of the match form.

Wireframes detailing main pages of 'mydiary' website including login, sign up, user profile, chat feature, and main page feature
Wireframes detailing main pages of 'mydiary' website including login, sign up, user profile, chat feature, and main page feature

Final Screen Versions

Final Screen Versions

Here are my final screens detailing my design decisions.

final screen login page
Sign Up Page
Welcome Back Page (Home Page)
Profile View (Newletters)
Profile View (Posts)
'mydiary' chat feature
initial Home Page Design
Newletter Search Page
Newletter Page Details
users chatting with each other
diary funtion interface
final screen login page
initial Home Page Design
Sign Up Page
Newletter Search Page
Welcome Back Page (Home Page)
Newletter Page Details
Profile View (Newletters)
users chatting with each other
Profile View (Posts)
diary funtion interface
'mydiary' chat feature

Final Takeaways

Final Takeaways

Through this project, I was able to learn about different assets essential to social media platforms that a user would enjoy.


Creating a Safe-Space

By analyzing my userbase I was able to understand the importance of including safe space and mental health options for users to feel comfortable through implementing friend messaging interactions and diary notes.


Open Expression

The functionality of mydiary allows users to post what they feel comfortable with including optional newsletters and customization of profile features.

How Would I Take Things Further?

How Would I Take Things Further?

I would be interested in seeing ways to involve more commenting and discussion boards to create optional dialog among other users.


Customization

Customization is important, I would like to implement color and background-changing abilities for the UI for users to feel fulfilled with their envisioned environment.


User Input and Testing

Although I had user surveys, I would like to spend more time having the mydiary prototype tested for user insurance.

Next Project?
Next Project?

Create a free website with Framer, the website builder loved by startups, designers and agencies.