Velvet Paw

App Interface, Logotype, and Icons

Velvet Paw, a fictional cat cafe and bookstore, has a new mobile app that utilizes a bold logotype, thirteen playful custom icons, and a stunning user interface. The prototype displays the user’s journey through booking a session with the cats, adding a drink from the menu, and placing the order.

The mobile app is the user’s one-stop shop to explore what Velvet Paw Cat Café offers. After logging in, the home page welcomes the user to upcoming events at the café, drinks and treat menu items, adopt, watch live cat cams, and more. Some key features of the app include a pop-up menu in the navigation bar, custom icons with a uniform swirl design, booking a reservation, and browsing menu options. In the early development stages, a paper wireframe visually outlines the overall app

and helps decide what types of icons function well in the app. While Velvet Paw’s logo and icons were still in their infancy, the wireframe was user tested, gaining insight to create an app prototype via Adobe XD. Overall, the Velvet Paw app’s functionality focuses on human-centered design and utilizes thoughtful UX/UI design.

Velvet Paw’s purple and gold color scheme is inspired by the historic relationship between cats and royalty. The logotype utilizes the typeface Filson Soft, which offers a bold look with curled finials to give the logotype an elegant, regal, and debonnaire feel. There is also a cutout in the P of “Paw” in the shape of a paw print, which is the perfect touch to quickly identify the company as a cat cafe.

Sketches

Sketches of Velvet Paw logo and icons

Velvet Paw logo sketches

logo sketches

Velvet Paw sketches of brainstormed icons

icons: phase 1 sketches

Velvet Paw sketches of icons developed

icons: phase 2 sketches

Wireframe

Paper wireframe of app screens

Velvet Paw paper wireframe with the first 3 screens, including the launch, login, and homepage.

screens: launch, log in, home page

Velvet Paw paper wireframe with the final 3 screens, including the booking options, add-on services, and menu.

screens: booking types, add-ons, beverage menu

Logotype

Primary logo only utilizing the company’s name, Velvet Paw, in stylized typography

Velvet Paw logo black and white

black & white

Velvet Paw logo reversed

reversed

Velvet Paw logo color

full color

Combination Mark

Logo utilized at smaller sizes and in the navigation bar of the app’s interface

Velvet Paw combination mark black and white

black & white

Velvet Paw combination mark reversed

reversed

Velvet Paw combination mark color

full color

Icons

13 custom icons used throughout the Velvet Paw app

Velvet Paw app icon

Velvet Paw

Velvet Paw settings icon

settings

Velvet Paw home icon

home

Velvet Paw favorites icon

favorites

Velvet Paw hot beverages icon

hot beverages

Velvet Paw iced beverages icon

iced beverages

Velvet Paw search icon

search

Velvet Paw more icon

more

Velvet Paw back icon

back

Velvet Paw treats icon

treats

Velvet Paw library icon

library

Velvet Paw meet the cats icon

meet the cats

Velvet Paw livestream icon

livestream

Final Interactive App Prototype

Velvet Paw Home Screen Final Prototype

home screen & Velvet Paw icon

Velvet Paw Launch App Final Prototype

launch Velvet Paw app

Velvet Paw Homepage Final Prototype

homepage

Velvet Paw Booking Options Final Prototype

booking options

Velvet Paw Add-On Services Final Prototype

order add-ons

Velvet Paw Beverage Menu Final Prototype

beverage menu

Velvet Paw Review Order Final Prototype

review order

Velvet Paw Order Confirmation Final Prototype

confirm order

Mockups

Velvet Paw app home and menu pages mocked up on mobile

velvet paw home page mocked up on phone
Velvet Paw mocked up on phone