→
Menu
→
Menu
←
←
My works
My works
Flowk
mvp Completed
Project
3/6
social network
mobile app
Flowk is a new social network built around short videos created for one purpose: collaboration. So, what is a flowk?
Flowks are chains of content where each video plays off the one before it. It can be a continuation of a dance, the passing of a ball, trick shots, or any activity at any time and with anyone anywhere. That was a word sandwich, but hopefully you get the picture. A flowk could also be built around a theme. Post your favorite beach walk and invite users to flowk their favorite walks. Create a virtual fashion show where users flowk together their OOTDs.
Flowk is a new social network built around short videos created for one purpose: collaboration. So, what is a flowk?
Flowks are chains of content where each video plays off the one before it. It can be a continuation of a dance, the passing of a ball, trick shots, or any activity at any time and with anyone anywhere. That was a word sandwich, but hopefully you get the picture. A flowk could also be built around a theme. Post your favorite beach walk and invite users to flowk their favorite walks. Create a virtual fashion show where users flowk together their OOTDs.
app store
→
app store
→
app store
→
app store
→
Team
loonar studios
Team
loonar studios
responsibilities
ux/ui design
graphic design
responsibilities
ux/ui design
graphic design
In numbers
200+ hours
90+ screens
In numbers
200+ hours
90+ screens
Let's reimagine the social experience into one that is shared, collaborative, and FUN!
→ challenge
One of my first large project on a new role of interface designer. And one of the most interesting for research and creation. Inspired with Tik-Tok but with his own unique features and philosophy. During the design stage I had a few challenges that need to solve and will tell about the most of them in this article.
One of my first large project on a new role of interface designer. And one of the most interesting for research and creation. Inspired with Tik-Tok but with his own unique features and philosophy. During the design stage I had a few challenges that need to solve and will tell about the most of them in this article.
→ My role
Throughout the entire development of the MVP, I was responsible for creating the concept of a new application design based on existing research. I conducted additional research, such as analyzing competitive solutions, employing best practices in specific cases, making stylistic decisions, building new user journeys, creating prototypes, and discussing potential implementation paths with the development team.
Throughout the entire development of the MVP, I was responsible for creating the concept of a new application design based on existing research. I conducted additional research, such as analyzing competitive solutions, employing best practices in specific cases, making stylistic decisions, building new user journeys, creating prototypes, and discussing potential implementation paths with the development team.
Design process
→ Discovery
The client came well-prepared and provided us with the necessary data about the potential audience, competitor analysis, as well as initial sketches of the application created by the previous team. For certain reasons, that design was not accepted, and in collaboration with the project manager and the client directly, we had to do everything differently and reconsider both the application's logic and its visual appearance.
The client came well-prepared and provided us with the necessary data about the potential audience, competitor analysis, as well as initial sketches of the application created by the previous team. For certain reasons, that design was not accepted, and in collaboration with the project manager and the client directly, we had to do everything differently and reconsider both the application's logic and its visual appearance.
→ concept development
One of the experiments implemented in the design development process was to skip the wireframing stage and test all key design decisions using concepts. In conclusion, it can be said that such an approach justified itself in this project. However, this is a highly individual story, and in the future, most of the projects go through the stage of designing mid-fidelity wireframes.
One of the experiments implemented in the design development process was to skip the wireframing stage and test all key design decisions using concepts. In conclusion, it can be said that such an approach justified itself in this project. However, this is a highly individual story, and in the future, most of the projects go through the stage of designing mid-fidelity wireframes.
Features and flows
→ onboarding
The initial impression of the application is strictly important for retaining users in the future. For the first version of the application, we decided to focus on an overview of key features. This user flow will help users quickly understand the purpose and immerse themselves faster in the world of Flowk.
The initial impression of the application is strictly important for retaining users in the future. For the first version of the application, we decided to focus on an overview of key features. This user flow will help users quickly understand the purpose and immerse themselves faster in the world of Flowk.
→ Feed
The feed is where users spend the most time, making it crucial to maintain familiar interaction patterns while introducing a fresh approach to displaying and engaging with content.
My task was to balance these aspects effectively. The result is the user journey illustrated in the image below.
The feed is where users spend the most time, making it crucial to maintain familiar interaction patterns while introducing a fresh approach to displaying and engaging with content.
My task was to balance these aspects effectively. The result is the user journey illustrated in the image below.
→ Discovery
Users should have the freedom to decide how they search for information, and our role is to provide the right tools to make it easy. In the Discovery section, we implemented a flow of recommended videos that load and scroll horizontally (as per the client’s request).
Additionally, a search bar was added at the top, allowing users to filter results by categories such as Videos, Flows, Users, and Hashtags.
Users should have the freedom to decide how they search for information, and our role is to provide the right tools to make it easy. In the Discovery section, we implemented a flow of recommended videos that load and scroll horizontally (as per the client’s request).
Additionally, a search bar was added at the top, allowing users to filter results by categories such as Videos, Flows, Users, and Hashtags.
→ user profile
User accounts, whether their own or someone else's, allow access to both the author's videos and their Flowks — reactions the user has left on other creators' videos.
Additionally, at the client’s request, a Find Friends button was added to the personal account page. This feature lets users search for friends across the platform or, with the necessary permissions, select from their existing contact list.
User accounts, whether their own or someone else's, allow access to both the author's videos and their Flowks — reactions the user has left on other creators' videos.
Additionally, at the client’s request, a Find Friends button was added to the personal account page. This feature lets users search for friends across the platform or, with the necessary permissions, select from their existing contact list.
→ shoot and edit
Currently, the post-processing menu for videos offers only basic functionality, with plans to expand it in the future. At this stage, users can:
Trim video length.
Select a cover image.
Apply filters from a few presets.
Add simple text overlays to the video.
Currently, the post-processing menu for videos offers only basic functionality, with plans to expand it in the future. At this stage, users can:
Trim video length.
Select a cover image.
Apply filters from a few presets.
Add simple text overlays to the video.
→ Publish
Before publishing a video, users can add a standard set of optional information to their video or flow:
Description
Hashtags
Tag Other Users
Location
To maintain a friendly and positive atmosphere within the platform, a profanity filter has been implemented. If offensive language is detected, the system prompts the user to revise their content; otherwise, the video cannot be published.
Before publishing a video, users can add a standard set of optional information to their video or flow:
Description
Hashtags
Tag Other Users
Location
To maintain a friendly and positive atmosphere within the platform, a profanity filter has been implemented. If offensive language is detected, the system prompts the user to revise their content; otherwise, the video cannot be published.
Key takeaways
This ongoing project has provided an opportunity to dive into the world of social media, explore user interactions with this type of application, and develop the functionality of a basic app version. The current version is designed as a foundation for future improvements and enhancements.
More case studies
corporative
redesign
Pillscare - Healthcare mobile app
corporative
redesign
Pillscare - Healthcare mobile app
corporative
redesign
Pillscare - Healthcare mobile app
corporative
redesign
Pillscare - Healthcare mobile app
corporative
redesign
WAIE - Electronic fueling system
corporative
redesign
WAIE - Electronic fueling system
corporative
redesign
WAIE - Electronic fueling system
corporative
redesign
WAIE - Electronic fueling system