instagram be-us web linkedin

SmartDVM: Brand Identity and UI/UX Case Study

6 min read Nov 15, 2023
Share This Blog on Your Social Media

Technology is growing at an amazing pace like never before. Its impact has gone far beyond affecting everything including pets. But how are pets affected by technology? One example is a veterinarian management system. It is a service that lets you keep track of your pets’ health history, find a veterinary clinic, and schedule an appointment. With this service, it is easy to take care of your pets. This case study will walk you through the steps we took to create the brand identity and user interface/experience for SmartDVM, a veterinary management system for veterinarians, veterinary clinics, and pet owners.

Brand Identity Design for SmartDVM

Branding is very important when it comes to giving a product its unique identity. In the case of SmartDVM, we achieved this by employing a wide range of marketing and psychological techniques in logo design, color and typography choice, and illustrative elements, all of which are intended to elicit a certain emotional response from the target audience. We will discuss each separately.


The mere existence of a logo may seem meaningless! However, with respect to a brand, it might transform your name into a visual trigger. SmartDVM, being a platform providing clinical services to pets, needed to make itself clear in its logo. To achieve this, we created an abstract logo for SmartDVM using a stethoscope and the first letter of the company’s name.

SMARTDVM’s Brand Identity; Logo Design

Color Palette

It goes without saying that color is a key factor in expressing your brand’s personality. Blue and orange were the primary colors we settled on for SmartDVM. Blue is primarily connected with peace and trust in color psychology. That’s why the logo and certain other aspects of the UI are predominantly blue to instill trust in the audience. On the other side, we also used orange, the complementary color of blue, in certain UI elements. It conveys feelings of excitement and warmth.

SMARTDVM’s Brand Identity; Color Palette


What made us pick the Poppins typeface for SmartDVM? Since SmartDVM was a pet-centric platform that took into account pet owners’ feelings and emotions, we decided to go with Poppins. Poppins is a font in the geometric Sans Serif family, which has become popular in web design. Poppins is a friendly, approachable typeface with a nice height and generous spacing between the letters that conveys a positive vibe to the reader, much like the love and companionship that pet owners feel for their pets.

SMARTDVM’s Brand Identity; Typography


What’s the next step after deciding on logos, color schemes, and fonts? This is where the illustration comes in. The illustration is probably the most important part of branding. Because it brings a brand to life, tells the story of the brand, and makes the concept clearer. It also gives the brand of a company more depth, personality, and feeling.

Take a look at the illustrations of SmartDVM; when you look at it, what emotions come to mind? Love is in the air for pets, as their owners and health providers take excellent care of them. When you look at these drawings, what other thoughts and emotions come into your head? Peace of mind, security, etc.

Character Design and Billboard Mockup for SMARTDVM

UI/UX Design

After branding design, it was time to design UI and UX.

When designing the UI/UX of the website, it was necessary to consider the two different types of users who would be using the platform. The first group was “direct users” who would register via SmartDVM. These included hospitals, clinics, and solo practices for whom we provisioned the hospital system. The other was “indirect users,” including clients, pet owners, and hospital staff members.


Our research was twofold. In order to understand what pet owners want from a veterinary management system, we first had interviews with pet owners. The following is what we found out. They mainly desired a straightforward and user-friendly platform. A platform that could quickly connect them to the closest available veterinarian, one that could remind them of their appointments and vaccination due dates, and one that could lighten the load of a busy person.

In the second part of our research, we looked at the competition. Before we began the design process, we looked into some of the biggest competitors in the industry. By doing this, we were able to figure out what each of the pet telehealth sites did well and what they could improve on. The findings are as follows:


  • Easy to use


  • Confusion
  • Invoicing differences
  • difficulty in finding the client or patient
  • Lack of a separate field for annual vaccination and a separate reminder for that.


After looking at the UX, we designed wireframes for each section on Figma to bring them to life. By making wireframes, we were able to find potential problems and solve them. Designing a wireframe lets you map out how the pages work, find problems early, and save time on revisions later. It is much easier to make changes to a wireframe.

The key goal we set for ourselves was accessibility and usability, therefore we made high-fidelity screens for both the desktop and mobile versions. There were some problems along the way, and we had to keep talking to our clients about them. By doing so, we were able to solve many of these problems. For instance, in the medical records section, we decided to add “create prescription” and “download SAOP” to make things easier for users. So, designing wireframes helps us solve these problems and come up with the right and exact product. It also speeds up the process of designing UI.

SMARTDVM’s High-Fidelity Wireframes


What makes prototyping such an important process? The prototyping process enables designers to test their designs prior to development. This is highly essential since it allows for possible issues and pain points to be fixed easily before the development and without investing a lot of time or money.

So, using prototyping, we were able to evaluate the user experience to see how people felt while using the platform and to identify any misunderstandings that might have occurred.

Were there any difficult moments during the prototype process?


In order to make the website look attractive and function successfully, it was vital to think about how it would work on mobile devices. A quick look at a couple of the screens on the mobile device is provided below.

SMARTDVM’s Mobile View

Final Design

After going through all of these different phases, we were finally able to create a design that was not only user-friendly but also easy and straightforward to use. You may get an idea of the finished product by looking at the following shots.

Design Components of SMARTDVM’s UI

Check out our previous articles at
Check out our articles on Medium.

Share This Blog on Your Social Media

Don't miss out on the latest updates!

Get weekly updates on the newest design stories, case studies and tips right in your mailbox.