The Tranquil App Logo

Tranquil — Immersive Study App for Apple Vision Pro

A flashcard-focused study app designed for visionOS to provide students with an immersive, mixed-reality environment and accommodate attention deficiencies with personalized settings.

Gabi Lewis
8 min readDec 5, 2023

--

Date

Fall 2023

Role

Lead Visual Designer

Project Overview

Develop an app for visionOS, optimized for the unreleased Apple Vision Pro, to address attention challenges among students, especially those in college. Utilize SwiftUI, Apple’s development framework, and design tools like Figma, Procreate, and Adobe Premiere Pro to craft an engaging, efficient, and user-friendly experience.

Team Tranquil!

The Problem

In an era dominated by technology, maintaining focus has become a significant challenge for students. Tranquil addresses this problem by providing a solution for distracted college students. Regardless of their surroundings, whether it’s a crowded student center or library, Tranquil enables users to block out distractions and focus on studying flashcards tailored to their preferences, promoting effective information retention for exams and quizzes.

The Solution

Ideation: Tranquil didn’t come together hastily; it evolved through a deliberate process. Tasked with the project, my team and I initially delved into researching the unreleased Apple Vision Pro. Despite my unfamiliarity with VR/AR headsets, I immersed myself in learning, watching keynotes, and devouring any related articles. The focus was on determining the ideal app for this unique device and exploring project possibilities. A comprehensive list emerged after extensive ideation, leading us to narrow down our focus on a study app — thus, Tranquil was born.

To ensure minimal distractions in the app design, we drew inspiration from successful platforms like Quizlet and Goodnotes, emphasizing a personalized experience without ads.

I drew the initial UX map, and our lead developer, Jack, translated our ideas into a tangible and functional form.

Research and early implementation: To best fit our app to students, the Tranquil team conducted a survey made up of multiple choice and free-response questions to over 100 college students around the US. Based on the information collected and additional research, we decided to focus specifically on enhancing the app’s flashcard-making capabilities.

Design Decisions: As the Lead Visual Designer for Tranquil, I played a pivotal role in shaping the app’s visual identity. Our goal was to align with Apple’s branding to seamlessly integrate the app into users’ daily lives, providing a sense of familiarity for this innovative technology. Adhering to Apple’s visual design guide, our design choices, including logos, fonts, colors, and inspiration, were carefully crafted. The objective was to create a sleek, calm interface that would set the tone for focused study sessions.

When you press each section on our VDG, a zip file of our assets will immediately download to your device.
To read more about the inspiration behind our design decisions, visit our Visual Design Guide!

The final deliverables:
Combining our ideas, research, and design efforts resulted in our final deliverable — the fully functional app!

Tranquil Beta (left) and Tranquil 1.1 (right)

Our research highlighted the significance of offering study options tailored to diverse student preferences and environments. Users can choose full immersion in selected environments, utilizing the Apple Vision Pro’s hand-eye gesture tracking technology for seamless flashcard study sessions, whether in their own living room, a lecture hall, or even outer space.

Environments include outer space, the ocean, a sunset, and a lecture hall.

Spatial Computing allows for the blending of one’s physical surroundings with a digital experience. Recognizing that not all users may wish for constant immersion in a virtual environment, we offer the option to study flashcards within their physical surroundings. Users can look up, down, and around — and remain in the environment of their choosing!

Move around your selected environment!

Results

So…what’s in store for Tranquil? Moving forward, we hope to include various study methods, such as matching and fill in the blank, to cater to all student preferences. Leveraging the powerful Apple Vision Pro, the potential for innovative studying approaches is limitless. Our vision includes an iOS/iPadOS/macOS companion app, seamlessly integrated into the Apple ecosystem — enabling users to input study information on another device and transmit it directly to the Apple Vision Pro. Additionally, we aim to incorporate a goal-setting feature, initially designed for watchOS compatibility, to notify and motivate students to achieve their personalized study goals.

Mock-up of goals feature

New Media Narrative

Hi! My name is Gabi Lewis and I am a fourth-year student at The University of Georgia. I am pursuing a degree in Marketing with an area of emphasis in Digital Marketing, as well as two certificates. The first is in New Media, involving front-end web development and creative design. The second is in Personal and Organizational Leadership, which I am obtaining through ILA, The Institute for Leadership Advancement through The Terry College of Business. My chosen coursework, extracurriculars, and experiences have taught me so much through the years — equipping me with a growth mindset that is ever-so-eager to learn.

The New Media Certificate was introduced to me in the middle of my sophomore year. Previously declared as a Design & Media minor, I was enrolled in a “Video Concepts” class at the start of Spring 2022. On paper, the minor seemed like everything I wanted. But, after the first week of classes, I knew I had to pivot and find a new program that better suited my interests. Then came the New Media Certificate.

I have always been captivated by design. For all of my life, I have known that in my career, I need to do something with a visual-aesthetic-design focus. I took traditional art classes, such as Drawing and Painting, as part of my high school curriculum. I loved my sketchbook, but I wondered about the digital world of art. So, I got an iPad. I doodle on photos to post on my “foodstagram” (shameless plug @gabbersandabbers), take beautifully color-coded notes for school, and so on. But–there is SO much more to know. Especially as a Digital Marketing Major looking to work in branding and social media. Luckily for me, I found the classes at UGA that would equip me with all of the best tools right here at the New Media Institute!

Eager to start, I took NMIX2010- Introduction to New Media in the Summer of 2022. I joined classes at 7 PM Israel time, completing all of my quizzes, discussions, and projects around my internship schedule. I was motivated to learn more, and I was so excited about taking Web Development in the fall!

In the Fall of 2022, I took NMIX4010-Web Development. I learned SO much while taking this course. I came in with zero experience coding, but by the end, I can confidently say I am capable. This class taught me a lot of valuable lessons. Of course, there are technical things: HTML, CSS, Bootstrap, WordPress, and basic JavaScript. On the lessons side, I learned to be patient. I learned that there is sometimes an easy fix, and sometimes, you may just have to cry and redo your entire project. I learned how to code with HTML and CSS, how to troubleshoot errors, and how to create beautiful websites! I had a great time in Web Development and would absolutely recommend it to a friend.

As New Media Industry “employees” in NMIX4210, we have privileged access to the latest industry trends, including insider knowledge on how to land that coveted J-O-B. Each week, accomplished professionals (who are often NMI alumni) share their insights and experiences from their respective fields. I have loved earning the certificate, but I especially appreciate the opportunity to gain a thorough understanding of my future career path through others’ expertise.

Fun fact: one of the speakers helped me land my Summer 2023 internship at Mercedes Benz USA! Like…this certificate is why I got my J-O-B. Thank you, NMI. ❤

Then came New Media Capstone. I had no idea what the class would entail, but I was excited to come into class with my collector’s card and find out! Funny enough, the one team I did not want to be on was the Apple Vision Pro. It felt…really intimidating. I actively avoided finding out more about the device. Develop a functioning app for an unfamiliar, brand-new, kinda creepy headset? I’ll pass, thanks. Well, I am happy to tell you that my mind has changed. In fact, I have done a full 180. The Apple Vision Pro is the coolest thing ever, and I am so grateful to have been put on this team.

Capstone served as the perfect culmination of the skills and practices I’ve honed since the beginning of the certificate program. From web development to visual design to UX mapping, the project initially felt overwhelming, but the journey and final product turned out to be more rewarding than I could have imagined. Figma? Check. Xcode beta? Check. Keynote? Check. Beyond learning new platforms and coding languages, I have learned how to be an adaptive team member and a coachable student.

My enthusiasm for this certificate is well-known, often shared in my other classes as my “standout experience.” I’m incredibly grateful for the chance to delve into emerging technologies and learn from passionate professors and peers. The invaluable skills acquired are something I’ll carry with me throughout my life. Switching to the New Media certificate has truly transformed my perspective, making UX/UI and visual design in tech immensely appealing for my future career. Thank you for pushing me to learn and grow. Love you big time, NMI!

--

--

Gabi Lewis
0 Followers

Hi there! My name is Gabi Lewis and I am a third-year student studying Digital Marketing at The University of Georgia. Thanks for visiting my medium site!