Teavana Mobile

Sample mock up of Teavana's Canada mobile site. Teavana has recently opened in Canada but they currently do not have a mobile site, which I took the initiative to make a mock up page for personal interest.

image goes here.

Brand background

The Teavana dream began with an idea that people would enjoy fresh, high-quality tea in a place that was part Tea Bar, part Tea Emporium. We wanted to introduce people to the aromas, textures, and beneficial qualities of loose leaf teas while enlightening them with the history and variety of teas available. And this is how Teavana was born.

image goes here.


Start with simple sketches to bring the process of the user journey and wireframe mock ups together. Understanding the surface level helps layout the foundation before getting into the granular level.

image goes here.


Bring the sketches to a digital format and refine UI components such as typography, visual brand, and copy. Reviewing these UI elements before moving on to the graphics and development phase help reduce the need for a pivot in production.

image goes here.


Designing a sample web mobile site of Teavana Canada and understanding a waterfall process cycle, given a short period of time. In most cases a waterfall approach is used for campaign projects, where larger projects require an agile approach.

Image reference: Heidy D. Kurniawan Portfolio





Project role

UX Designer


Mobile Web