Device DIAGNOSTIC app

ART DIRECTION / VISUAL DESIGN / ILLUSTRATION

EDIT.jpg

T-care is the support system for smartron users. The T-care eco system has other services like live chat, store locators and device diagnostics.
The Device diagnostics application, with the help of a 36 point check, helps users to self assess the device health.

Role and responsibilities
I was responsible as the art director in this project. My primary responsibilities were to define the following:

  1. Design a cohesive visual language.

  2. Define the style for

    • Iconography

    • Typography

    • Illustrations

  3. Design the UI kit that could be used by other teams for further develop the app ecosystem.

    Before starting with the project the pre-existing team had already defined the User experience flows, user personas, service blueprint and wireframes.

tcare_device blueprint
Wireframes and basic structure received from UX team

Wireframes and basic structure received from UX team

Beginning with the mood board which was a visual representation of emotions attached with the app like care, together, side-by-side, comfort, support, communication and frustration, I defined the visual language, including color palette, typography, and overall look and feel of the app.

moodboard showcasing the initial idea, color pallet and look and feel

moodboard showcasing the initial idea, color pallet and look and feel

Artboard Copy.png

I also created the illustrations for the 36 diagnostic tests, that were simple, realistic and easy to understand. The extensive style guide included button styles, font styles, chat user-interface elements and cell design examples among other things.

tcare illustration.png
Screen design with UI elements, colours and illustrations

Screen design with UI elements, colours and illustrations