artsea
Collaboration and social platform for artists, designers, and social media users.
2024
Seeing the entire design pipeline through from start to finish was an immensely rewarding experience during my time with artsea. I worked closely with an intimate team of developers to define rapidly advancing prototypes. The design task was to create a web and app-based social platform that proved to be a nexus for designers and artists to share, collaborate, learn, and sell.
My role as lead UI/UX Designer was to ideate upon initial wireframes given to me by developers Alec Handal and Baruch Hen, to then setting up design systems and components for rapid prototyping as well as conveying artsea’s brand identity and mission through various iconography design and copy. After wireframes and prototypes were approved, I moved on to final designs for the platform that solidified the company’s design principles and content strategy.
The timeline took place over four months in the form of one week sprints. During these sprints, I would receive high-level briefing and critique from the founders and developers, with two days for edits in each week after the design period.
context
How do we innovate on existing social platforms while seamlessly introducing elements such as a marketplace, a learning/mentorship center, a job board, while also allowing easy collaboration between users?
challenge
My research for artsea consisted of interacting very meticulously with popular social/art platforms such as Twitter, ArtStation, and DeviantArt, as well as asset marketplaces such as Turbosquid and Gumroad. I also looked toward in-class examples of existing social functions and marketplace interactions to better grasp how artsea needed to differentiate and innovate. I conducted user interviews with artists and users of platforms like Twitter to identify pain points of existing design structures and learn how they interacted with these sites. Many of the interviewees stressed that they yearned for more intimate collaboration among mutual followers.
research
WIREFRAMES
FINAL DESIGNS
FINAL DESIGNS
FINAL DESIGNS
User Journey:
Profile
The final design for the profile page of User Journey took on a far more familiar and standardized approach. Similarly to the web layout, the user's vital information is displayed first, followed vertically by their bio, skills, portfolio showcase, interests, and languages. User may edit this information by tapping the pencil icon in the top right of their banner image.
FINAL DESIGNS
The desktop and mobile design of Artsea was an exciting challenge that allowed me to take full control of the process in an intimate environment. While Artsea is currently pivoting its business objectives, the project was highly engaging and rewarding. I grew significantly as a designer, embracing new trends and elevating my foundational design skills. I learned to let go of old tendencies and adapt to the evolving landscape of UI/UX design. The platform received excellent feedback from test users, who praised its efficient navigation and highly desirable design. This experience not only improved my technical abilities but also reinforced the importance of user-centered design and adaptability in achieving successful outcomes.
outcome
2024
A digital marketplace where users can buy and sell various assets such as 3D models, brushes for art apps, tutorials, courses, and more. The mentor features were consolidated into the marketplace to streamline the overall findability.
Exchange
FINAL DESIGNS
FINAL DESIGNS
A familiar timeline with various tabs, featured posts, events, and more. User can view/make posts, read messages, and interact with any of the featured media, events, and weekly prompts. Timeline tabs consist of For You, Following, Communities, and Bookmarks.
Social Home
A familiar timeline with various tabs, featured posts, events, and more. User can view/make posts, read messages, and interact with any of the featured media, events, and weekly prompts. Timeline tabs consist of For You, Following, Communities, and Bookmarks.
Messages
FINAL DESIGNS
A familiar timeline with various tabs, featured posts, events, and more. User can view/make posts, read messages, and interact with any of the featured media, events, and weekly prompts. Timeline tabs consist of For You, Following, Communities, and Bookmarks.
Explore
FINAL DESIGNS
Log in / Sign up screen. The user can opt to continue with Google, or sign in/up with an email and verification code. Following this process, they will be asked to create a unique username and state their date of birth if they are signing up.
Log In
Sign Up
Log In/Sign Up
& User Journey
FINAL DESIGNS
FINAL DESIGNS
Mobile
User Journey:
Portfolio
Following the same approach as above, the portfolio tab was approached with a straightforward and findable user design focus. I scaled down the portfolio entries from the wireframes and allowed the user to navigate to various Journey tabs via the scrolling menu at the top of their screen. From this tab, the user can view and edit their entries, add new entries via the plus sign button on the bottom right, and immediately post their new entry to their timeline.
FINAL DESIGNS
WIREFRAMES
Our initial Sign Up and User Journey wireframes were admittedly overdesigned to our detriment, and it caused a brief hang up when moving to V2 designs. The center button on the hotbar was a declining trend at the time as well, so I opted to remove it for a far simpler hotbar later on. User research provided feedback at this point that our design language appeared "flat and somewhat outdated", so I dropped the background brightness, and added transparency to the hotbar while also removing the center action button.
User Journey:
Activity/
Projects/
Resources
The activity tab uses the same design elements and structure as the user's social timeline, showcasing the user's contributions to artsea's timeline. The projects tab was a challenge in that we needed to offer a sort of resume for users' past projects and contributions in a condensed and digestible format. I decided on maintaining similar design language by using this card-like box for each entry where the user's project name, summary, role, and experience is listed clearly. A viewer may click the project card to view more info. After a user uploads a project entry, they may add additional contributions to the project. The resources tab is a simple receptacle for the user's assets for sale if there are any. Clicking an asset card will bring the viewer to the Exchange page for said asset.
FINAL DESIGNS
Social Home
Remaining structurally similar to the wireframes, the timeline operates under a few different types. "Social" is where users will see a vertical scrolling feed of all posts. They may filters these posts in different categories by clicking the tab at the bottom, above their hotbar. This allows the user to swap between "For You", "Following", "Communities', "Bookmarks", and "Featured & Prompts." The "Explore" tab at the top will swap the user's timeline to a grid-view feed of purely art. From here, they can freely browse all kinds of art without the social aspect in the way. The Featured & Prompts tab brings the user to a showcase for this week's art challenge prompt, as well as a featured project and portfolio entries. If a user clicks on the project card, they will see the expanded view below.
FINAL DESIGNS
Search
When a user clicks the search bar icon at the top of their interface, they will be brought to a dedicated search page where they can filter by user, mentor, community, project, post, or role. They can interact with the results directly from the search function's findings.
FINAL DESIGNS
Messages
Similar to the desktop version, the messages tab can be accessed via the message/envelope icon at the top of the interface. From there, the user may begin a new message and search to add recipients, view all other conversations, and block a user/delete a conversation without needing to open the message.
FINAL DESIGNS
Roles
The roles tab is unique to artsea, it does not show job listings for companies/clients outside of artsea, only projects that have been started by users already on the platform. Similar to the User Journey page, the user may swap tabs by using the scrolling menu at the top of the interface. Based on skills included in portfolio entries, various roles are recommended to the user. Upon clicking a card, the user will see the job description, required skills, and more. The user may also save roles and manage roles that they have posted, including approve and deny users that have applied for their role.
FINAL DESIGNS
Exchange
The mobile Exchange features a condensed, responsive layout of the desktop interface. In the same vain, the user may search for any asset via the centered search bar, or they can scroll down to view featured assets that are catered toward their applicable skill sets. Scroll further and they will come across the mentor banner and the recommended mentor list below that, where mentors that operate in the same artistic space will be recommended.
FINAL DESIGNS
Communities
The mobile Communities page uses condensed, responsive variants of the desktop interface for simplicity. On the communities tab, the user will see their currently joined communities, as well as recommended communities based on their skills. Inside a community, the user can interact with the timeline, view community showcase posts and events, and message users.
FINAL DESIGNS