Swell App Illustrations

Swell

Role

  • Illustrator

Client

Project Deliverable

  • In-App Illustrations

Summary

Swell is a to-do app that helps you get stuff done. Their team invited me to design and illustrate the app’s status messages to give users a sense of delight throughout the life of each task. An octopus character was used to represented the “admin” working behind-the-scenes for each to-do item.

Concept Sketches

During the initial stage, concepts were quickly sketched for each of the app's message status. I focused on composition and character gestures while trying out different ways to convey the message.

“The task has been added to the queue, waiting for an admin to pick it up.”

Task in queue sketch
We wanted the octopus to look like he’s waiting. A “ticket number” scene was favorited by the team.

“The task has been picked by an admin and someone is actively working on it.”

Task in picked up sketch
I was trying out different ways of him working on a laptop. Setting the laptop on the floor frees up more of his arms—making him more efficient.

“We’re backed up, so no one can work on it at the moment.”

Task in backed-up sketch
I thought having each arm doing a different task would be funny. Using multiple laptops was the favorite.

“Task can’t be answered/help by an admin.”

Task is non-helpable sketch
This status happens when a task can’t be assisted. I wanted to show the octopus regretting he couldn’t help, but willing to offer assistance when possible.

“Task Complete.”

Task complete sketch
We like the idea of celebrating a finished task.

Character Design

Swell’s team wanted an octopus to represent the “admin” role in the app. The character needed to lean towards a cute and soft feel — nothing “alien-like” in its appearance.

I modeled the octopus’ body to Swell’s lightbulb brand-mark. This symbol acts as a notification in the app’s UI, indicating “New Tips” from the admin are available.

Character design

Refined Sketches & Final Vectors

Task in queue sketch
Task in picked up sketch
Task in backed-up sketch
Task is non-helpable sketch
Task complete sketch

Final Screenshots

That’s It!

Thanks for reading. You can view these illustrations on the live site at Swell's app, or you can check out my other projects below.