TellMe

Google Pixel Mockup

"When designing TellMe, the goal was to create a minimalist social media platform to ask people questions anonymously."

Four Pixel phones where each of them displays a different screen of the app. They lay on a red surface.

Design decisions

When opening the app for the first time, you can immediately log in using your credentials with the centered and highlighted input fields. The colors are smooth on your eyes with the elements featuring the latest material design guidelines. You can hide or show the current password using the eye icon. If you decide to sign up instead, a carefully designed flow of small steps helps with the sign-up process. The reason behind this is to avoid overwhelming the user with information. When the user thinks that too much effort is needed to register, he might not use the app altogether.

Pixel which displays the register page of the app.

Sign up process

Another thing worth mentioning here is, that the current input field is selected automatically with the keyboard flying out too. The confirm button stays at the top at all times and is not getting covered by the keyboard, which leads to a carefree app interaction. Every step forward or backward is connected with a slide-in or slide-out animation, which signals the user in which direction he is going. With the cancel button at the top right, you can also go back to the login screen at all times without the hassle of going through the steps again.​​​​​​​

Pixel which displays the feed screen of the app.

Navigation

The navigation is done using the material design bottom navigation bar. The use of a hamburger menu is discouraged here as the user is expected to transition between the different destinations very quickly. The constant sliding of the hamburger menu would lead to a bad user experience in my opinion. With the search icon in the middle, the labeled icons and great thumb reachability, navigating the app feels effortless.

iPhone which displays the about page of the website.

Profile

The user profile features the most important information at the top. You can see the username as well as the display name of the user. Below the profile image are the user statistics, where you can see the current amount of answered tells, followers people the user is following. The input field encourages to write something to the user. When clicking on the input field, you are presented with a new, non-distracting screen that focuses solely on the message you want to write. The button to send the message changes its color accordingly, based on whether or not the message is considered valid. Next up is the about section which displays additional information the user would like to convey to other people. Additionally, you can see their latest answered questions sorted by the reply date.

Pixel which displays the send screen of the app.

Following & Followers

After you clicked on the user statistics, a new screen opens and displays the list of users. This increases discoverability within the network and enables you to quickly glance at profiles from other people or follow them right away from inside the list.

Pixel which displays the follow screen of the app.

Search

The search functionality is kept fairly simple and features instant result loading. After you didn't type something for half a second, the search is automatically triggered with the current input field text. When selecting a user from the results, the user data gets cached on the device with the latest search property being set to the current time. This enables another great feature like showing the latest searches, with the most recent user being on the left. You can also clear your latest search results using the clear button on the top right.

Pixel which displays the search screen of the app.

Thank you for reading!