top of page
The New "Moleskine Social Network"
Added a social-networking feature to the Moleskine's Digital Notes App to allow other Moleskine users to interact with each other and each other’s content.
Figma
2 week sprint
Project Manager
February 2023
Group Project For GA
- UXDI Certification
The Moleskine Digital Smart-Notebook
-
Multiple applications for a variety of different devices.
-
Convert different types of hand-written compositions to digital transcriptions and sketches.
-
Write or draw in a paper-filled notebook with a special transcription pen.
-
Depending on the specific content, users have a choice between a:
- notes app
- sketching app
- calendar app
- time management app(s)
- journal app
- camera app
Problem
Users need a quick and easy way to share work through the Moleskine Notes app to connect and engage with other content creators and to find potential clients.
The most logical place to put the "share to the social media app" buttons were after the user decides to export & share their work. This menu allows users to decide what format they want to export their notes or sketches as, and allows them to proceed to a list of social media apps.
Solution
The Solution was to simply design a proceeding page with the different social - networking platforms for users to share on, including a place that connects Moleskine Notebook users.
Thus, The Moleskine Social Network was conceptualized, helping to create opportunity from community and social networking .
The UX Design Process : (Step 1) Research & Synthesis
What are the problems users are experiencing and how can we design solutions?
What do users want?
Users want to share their content easily and professionally.
User Interview Takeaways
How do content creators share their content and what problems can we solve for them?
Biggest Problems
"I don't like how difficult it is to share my content with those who will appreciate it most."
"I wish sharing content and supporting other creators was less
time consuming."
"I am concerned with potential plagiarizing and scams regarding my content."
Favorite Features
"I want to share my content on social media to show my skills and work to potential employers."
"I like using hashtags to find new groups and content that I like"
"I love tagging people who I collaborate with to give them credit and to show who inspires me."
Types of Content
Digital vs. Analog
5/5 5/5
Drawing/Sketches
5/5
Painting/Illustrations
4/5
Other Art
2/5
What social platforms do creaters post their content onto?
-- 100% of creators shared their content on Instagram
-- 40% of creators shared their content through their own website portfolios
-- 20% of creators shared their content on Twitter
-- 20 % of creators shared their content with their friends on iMessage
Why did so many users post content on instagram?
And what else can we learn from instagram's users?
Likes
VS.
Dislikes
--
--
"I love the supportive community!"
"I love how easy hashtags allow me to find new creators and content!"
--
"It takes way too much effort to add a bunch of hashtags and long descriptions just so my posts appear more often on other people's feed!"
--
"I love how the gallery view makes it quick and easy to scroll through a lot of content!"
--
"It takes way too much effort to manage multiple apps just to post my content the way I want it!"
--
"I love being able to post multiple pictures!"
--
"Editing multiple images to post on instagram is difficult and has many limitations!"
--
"I love using the stickers feature!"
--
"I love using Instagram's animations in stories to make them more interesting and engaging!"
--
"Sometimes Instagram shows the posts I pay to advertise to the wrong audience!"
--
"I wish Instagram didn't show as many ads"
--
"I love the stories feature because they're not permanent!"
--
"I love that instagram allows me to block people who cause problems!"
User Needs
What do creators want to see in a social-networking app?
- Community -
- Portfolio / Profile Gallery -
- Maximum Exposure -
- No Ads -
Feature Priorities
Which features should we focus on first?
Feature Analysis of Competitor Art-Sharing Apps
User Preferences/Needs
- Gallery View -
- Gallery View -
- Gallery View -
- Exclusive Social Networking -
Having a separate (from popular platforms like instagram) social media feature inside the Moleskine Notes App eliminates Ads and possible scammers / unwanted audience members for Moleskine's users.
- Gallery View -
Placing a gallery for content creators to easily scroll through to see and engage with other creators and potential clients was one of the main features needed by the creators that we interviewed in the initial research phase.
These important features of the social networking app covers the user's wants of creating a reliable community so they can build their network and possibly gain support for their work.
The UX Design Process : (Step 2)
Defining Problems and Solutions
Here, we focus on the problem and decide which solutions are feasible.
Problem Statement
Users need a quick and easy way to share their work through the Moleskine Applications in order to connect and engage with other content creators and to find potential paying clients.
Moleskine Notes Application Limitations
Step 1:
The Notes App can transcribe your hand - written notes to digital notes
Step 2:
Step 3:
After selecting what format to export as, the user proceeds to save their content on the app, but it does NOT have the option to share their work on any social network
After the transcription, users have the option to export and share their notes
So, How Might We . . .
. . . successfully connect content creators to benefit from one another?
. . . create a way to engage with new opportunities effortlessly?
. . . earn creator's trust to manage their professional portfolio?
The UX Design Process : (Step 3) Designing Solutions
This is the step where we take what we learned from our research and arrange design conventions to solve our user's needs.
Initial Design Ideas
Sketches and Wireframes
Sketches in Design Studio
30 minutes to collaborate with two other people, focusing on which pages we should start
My Sketches - Gallery View & Discover Feed Pages
The Other Researcher's Sketches - Home Feed & Notification Pages
First Wireframes & User Flows
To continue the user journey from the Moleskine Notes App to
The Moleskine Social Network
User Flow 1 - Create A Post
These pages allow users to share the content they've just made on the Moleskine Notes App, and potentially every other app owned by Moleskine to the new "Moleskine Social Network" app on whatever device they're using.
Add Post Details
Post Details
Live Feed
Gallery / User Profile
User Flow 2 - DM a Fellow Creator
These pages allow users to scroll through the content they've just made on their device, and scroll through other user's content. They have the option to filter the feed so they can easily find content and artists or authors that they may be interested in. They can navigate to a creator's profile and then send them a message.
"Discover New Content" Feed:
Live Discover Feed of who is recently posting new content
Filters to apply to the feed
Filter applied and feed now shows "posts by new creators"
"Home Content" Feed:
Live Feed of who the user is following and groups they are apart of with filter options
Live Feed filters include selecting one artist the user follows
Selecting their name, post, or image navigates to their profile page allowing users to contact them
Direct Messaging other content creators:
Once "Messages" are selected, a thread with the messages sent to that creator comes up and the user is directed to write a message to the creator they are interested in
Once the message is typed out, the return button on the keyboard allows the user to send the message
Here, the message appears above the input box to let the user know they've sent the message
We also added a notifications section to easily access engagements within the new social network
"Notifications" Section:
Once the message is sent, the user can press the back button to get into their inbox to see other messages from other content creators
The user may also navigate to the other tab in this section to reach their notifications for follows, comments, and likes
The UX Design Process : (Step 4) Testing Solutions
This is the step where we test the usability of our prototyped designs
Prototyping & Usability Testing
We asked users to navigate through our prototype of the new Moleskine Social Networking App and give us feedback about the content, design and usability.
Mid-Fidelity
User Scenarios
1. You are a freelance illustrator and you have picked out some pages from your Moleskine Notes App that you want to share. Show me how you would customize and then create your post.
2. You come across an awesome illustration of some Beluga whales by MermaidScales. You want to reach out to them and ask some advice on how to improve any illustration skills. Show me how you would send a direct message to MermaidScales in the social-networking section of the app.
What our testers said
100% of the testers said they loved the well-organized filter options
66% of the testers found creating a post was easy and smooth.
Most of the testers were confused about the difference between the home feed and the discovery feed
Testers said they would rather see specifically if their message had been sent our not
A couple testers mentioned that when sending a message, the return button on the keyboard was confusing to them. The testers said they expected to see a separate send button at the end of the typed out message.
High-Fidelity
Changes made to the Mid-Fi to establish
the High-Fi Prototype
We replaced the create post button with a button that reads, "Create A Post"
We added a send button in the input box for the messages
We made a "sent" notification at the end of the message that was sent to assure users that their message had been successfully sent
What our testers said
100% of the testers said they found creating a post easy and smooth
50% of the testers said that they would prefer to select the filters and see the changes automatically happen on the page
50% of the users wanted to see more contrast on the layout
50% of the testers asked for bigger buttons and images
Next Steps
We would love to...
Add an "apply filter" button to all overlay menus
Increase color contrast
Increase sizing for different elements such as send button, post in gallery view
Include a way to get back to the Notes App while the users are anywhere in the app
Conclusions
- Takeaways -
Overall, most of the testers found the whole process intuitive and smooth
Each person thinks and see differently and it's hard to include everyone's insights
We would love the time to add the cool special features we thought of for future iterations
bottom of page