CLOSE

View of the Comm home screen

+ DESIGN @ COMM +

An encrypted messaging app for communities and
Farcaster client.

I joined Comm in November 2023 with the role of Growth Lead, but slowly became more of an all-inclusive designer for the early-stage startup. Alongside managing social media and cold outreach, I redesigned the logo and three core flows for the mobile and web app. This page only covers my design-related work for the company.

TOOLS USED

Figma
Photoshop
Adobe Premiere Pro

ROLE

Product Designer
Social Media Lead

CATEGORY

Product Design Case Study

COLLABWeekly design crits
Async for visual QA.

DELIVERABLESFigma Prototypes
Marketing Assets
Logo

TEAM

Ashoat
Bartek
Tomek

🔒
QR sign-in flow

Intuitive, ultra-secure sign-in for secondary devices

PROBLEM

Comm’s sign-in needed better security.

Comm’s whitepaper promised an upgraded security sign-in process with a QR code sign-in to increase account security.

RESEARCH

sdasdfasdf

The new flow required users to create an account on their smartphone (the primary device), and use that device to scan QR codes on the other (secondary) devices to sign them in.

RESEARCHThe
SOLUTIONAn accessible flow that guides users through the unfamiliar login process with tips and imagery.
I used the Comm design system’s text and color styles and design guidelines to compliment the rest of the app’s flat and minimal design. Lastly, I designed the vector of the laptop and the smartphone to symbolically signify the process of adding a new device. Verified every text-to-background pair at ≥ 4.5:1 contrast (WCAG AA) with Stark before release.
This is an incredibly important, highly visible flow—it’s how every Comm user adds new devices to their account to this day.

💬
chat creation flow

Create a new chat or find an existing chat—now with Farcaster DMs

(*image unavailable; not public, will update when released*)

PROBLEMComm had to update to users to create chats of a brand-new type (Farcaster DMs).
RESEARCHI researched existing multi-protocol chat apps (Beeper and Texts.com) to understand how they managed letting users select the chat type vs users for their group chat. Then, Ashoat and I reviewed our existing chat creation flow and discussed what could be changed, and iterated on the screens over several weeks.

SOLUTIONI built comprehensive screens that handled edge cases with an eye for accessibility and minimal changes for frontend development.

On the main chat creation screen, we let users select chat type from a dropdown and other users from a list. If they selected a chat type first (Comm or Farcaster), the list of users updated to display only the users available on the selected protocol.
When users were selected, if there was an existing chat, it would autopopulate. If users had multiple pre-existing chats with the same group (e.g. Farcaster and Comm chat), the autopopulated chat would show in the hierarchy of Comm chat > Farcaster DM > Genesis chat. An icon in the top-right corner would indicate which chat type being autopopulated.
Finally, if a chat didn’t exist between two users, the chat would default to a Comm chat, also indicated in the top right corner.
If a group chat could only be made in one possible chat due to an added user being only available on one protocol, we added an info icon that informed the user about why they wouldn’t be able to change the chat type.

I used the existing design system (colors, styles, font sizes) to ensure visual compatibility.

🔁
account recovery flow
Recover your account with your crypto wallet

PROBLEMUsers were unable to restore lost accounts.

SOLUTIONI designed a simple flow and icons that let users restore their accounts with their Ethereum wallet.

🎭
logo redesign
Communicating our multi-protocol future

PROBLEMIn the new multi-protocol app, the Comm “C” logo was undifferentiated and confusing next to the Warpcast (now Farcaster) arch logo. The logo needed to be updated to appear distinct, and needed to communicate privacy, chats, and our multi-protocol future.

asdfasd

SOLUTIONI combined three symbols—lock, chat bubble, and second chat bubble—to signify privacy, messaging, and multi-protocol.

📀
launch video

Motion graphics and live demo

https://farcaster.xyz/ashoat.eth/0x427722f7. Made in Adobe Premiere Pro.

🌍
social media content

Minimal, casual, and privacy-focused brand presence

https://farcaster.xyz/comm.eth

All posts from account inception to 5/18/25. Graphic design (logo, features) and copy.

back to top