Case Study


Type: Product
Services: UI/UX Design
Year: 2021
Platform: Figma, Adobe xd, iOS, Android
Dater Banner Mobile
Left Dots
Right Dots
Case Study


Type: Product
Services: UI/UX Design
Year: 2021
Platform: Figma, Adobe xd, iOS, Android

About the project

Dater logo

Dater is a premium mobile dating app design kit that is inspired by apps like Tinder, Badoo, Match, Happn, Facebook Dating, etc. It contains high-quality, useful design elements and screens to help build a dating mobile app.

Dater key features

Premium Svg

48 Premium designed screens

Fully Layered Svg


Fully Editable Svg


Custom Svg

9 Custom

Vector Icons

49 Custom
vector icons

Apple Font



We used the SF Pro Display as the typeface for a clean and modern look.

Typography SF Pro Display
Typography SF Pro Display

Onboarding screens

3 premium screens for onboarding the users.

On Boarding Mobile
On Boarding

Sign up & login

We designed the sign up screens to have a 3-steps process. The users have an option to register with their email or sign in directly through their Google account. You then enter your phone number to generate a code that will be used to sign in and start using the app. You can add more details about yourself and set up your profile to distinguish yourself from the crowd.

Sign Up Mobile Sign Up & Login Dots On Boarding Vector


The Discover screen is designed to help users find other nearby users. It also showcases the geolocation feature where users are able to connect and communicate with other users.

The app design offers 2 viewing options. The Classic View enables the user to see profiles in a fullscreen mode, where they can swipe right to like and swipe left to dislike a profile. In the Gallery View, user profiles are visible in a grid, and a single tap would take you to their full profile.

Discover Img Top Discover Classic View
Discover Img Bottom Discover Gallery View

Discover people around the world

Discover World Discover Dots

Chat with your match

Chat Img Left
Chat With Your Match
Chat Img Right
Chat Dots Chat Vector Left Chat Right


The settings screen is designed to show where the users can add or edit their personal information, upload a profile picture, and set their privacy, notification, and other settings.

Setting Mobile Setting
Setting Vector Left Setting Vector Right

About dater plus

A special screen was designed for apps that have premium in-app purchases. We call it Dater Plus. In order to beat the competition and connect with your ideal match, Dater Plus offers the users access to advanced features, such as super like, dater boost, unlimited likes, and special filters.

About Dater Mobile
About Dater Plus
About Dater Plus
About Plus Vector Left
Get UI-Kit Get UI-Kit

Get the Dater
Mobile App Design UI Kit

Dater is a full featured UI kit for mobile app containing 48 premium ready-to-use screens, 9 fully-editable vector illustrations, and 49 icons, all custom-designed. It also comes with a fully-interactive & linked prototype inside the Figma file to help personalize the UX flow and develop your app in a shorter time.

Buy Dater in

 Get The Dater

Whether you need a basic or enterprise solution, the Pixelative team has all the necessary, professional expertise.

Book a call