FIELD NOTES
Notes on
designing
for people.
Vol I 2025-2026
Janae Thomas
Learning Experience
Designer
UX Designer
UX Researcher
Systems Thinker
-
-
-
-
PROCESS
Understand → Map → Build → Iterate
VALUES
01
02
03
Accessibility is the brief, not a footnote.
If the user has to think twice, the design
didn't think enough.
Good research means listening to the people
the data forgot.
BY THE NUMBERS
6+
500+
3
years designing experiences
learners and users served
disciplines, one through line
k-12
·
higher ed
·
freelance
courses
·
digital assests
·
training
education
·
ID
·
UX
LEARNING DESIGN
ux research
accessibility
accessibility
accessibility
accessibility
01
02
03
← Back to UX Design
UX Design Case Study
Diálogos
Solo designer
Summer 2025 · TWC 544 User Experience
Figma
After some time reflecting on my current position and my background in education, I ultimately decided on creating a social media app geared toward academia, specifically students, faculty members, and researchers.
Problem
Since I work in higher education, I have recognized a translation gap between students and professors. A lot of professors and faculty members struggle to recognize how students interact with and use technology in their day-to-day lives, and how important that is to their everyday being, or their identity in a sense. Many students express themselves on social media.
However, I was worried about building an app that might further discourage genuine connections between individuals, because I feel that in higher education, the professor-student relationship is tremendously important, especially for students from marginalized backgrounds. Allowing more informal ways to lead to formal conversations can encourage students to be more proactive and care a bit more about their education and educational journey.
Outcome
After submitting my final draft of my UX Strategy Report, I received a 98/100, with the instructor highlighting how they liked my report's layout and commending me on how I organized large chunks of text.
Although this project did not require us to create a fully functional prototype, I knew I wanted to continue developing the design. Because of this, I also created high-fidelity wireframes for additional elements, such as the "Agoras," or hubs. These spaces function as digital clubs or small organizations.
Context
I chose a local bookstore and conducted user research on its digital storefront. Through this analysis, I developed personas, conducted user interviews and observations, and created a user journey map based on my observations that informed my final user journey report.
What I'm hoping to do with the app ultimately is connect more faculty, students, and professionals on a larger scale to promote the value of education and encourage more research at underfunded universities and programs.
Research Methods
Personas, user interviews, user observations, and a user journey map — conducted on a local bookstore's digital storefront in the lead-up assignments, then applied to Diálogos through Jesse James Garrett's five-plane UX product development process.
Process
TWC 544 UX Strategy Report sketches. These early sketches capture how I erased and retraced directly on paper, refining the layout before translating it into low-fidelity wireframes.
TWC 544 Diálogos high-fidelity wireframes. These high-fidelity screens show how a user might progress through the app, from logging in to the reflective prompt to navigating the home screen, and the different button interactions, such as "Read" and "Reflect".
TWC 544 UX Strategy Report 'Skeleton' page. Within this report, I explained how I applied Garrett's UX design model, detailing each step, including developing the 'Skeleton' (low-fidelity wireframes).
TWC 544 UX Strategy Report 'High-Fidelity Wireframes' page. This page in the report included most of the high-fidelity wireframes I created for this project (though not all). When deciding which high-fidelity wireframes to include, I focused on which interactions users would find most attractive or helpful.
Key Decisions
When it came to colors, I was very intentional about choosing light, muted tones that did not cause cognitive overload but still conveyed intellectual curiosity and earnestness.
When I designed the logo, I drew on classic philosophical imagery of dialogue: two people sitting in chairs, wearing togas, and engaging in conversation. I also wanted to include elements that represent connection, which is why the hands are included in the logo. In the hands is an internet globe, representing the idea that although we interact through a digital medium, we can still cultivate genuine connections.
Because I wanted users to consciously reflect on their conversations and questions within the app, I was very deliberate about adding design components that require users to slow down and build connections that may not be apparent in the moment. Within my high-fidelity wireframes, I included a daily reflective prompt that greets users before they enter the rest of the app and view their timeline. This prompt requires users to pause, think, and reflect before typing their response. They can then save their response to their journal if they choose.
For Diálogos, I ultimately decided on EB Garamond and Open Sans, Open Sans for paragraph text, and EB Garamond as the primary header text, because it was integral to the styling I wanted.
Usability Testing
Accessibility
When it came to colors, I was very intentional about choosing light, muted tones that did not cause cognitive overload but still conveyed intellectual curiosity and earnestness.
I highlighted my efforts to reduce clutter and create an experience that does not overwhelm the user.
Reflection
The groundwork laid by studying these highly regarded texts and completing a user research project provided a strong foundation as I began developing my own digital product. I employed many strategies, intentionally and habitually, because I had studied so much material before designing my own application.
After determining my design, I began sketching. Considering my previous professor's advice on sketching and the purpose of developing sketches, I decided to buy a notebook dedicated strictly to my UX ideas. I used it as my ideation notebook for all my sketching and design-related brainstorming. Working through these sketches on paper felt much more intuitive; it allowed me to really see, erase, and reiterate on the idea multiple times, until I finally pinned down a good foundational starting point for how I wanted to design Diálogos.
After finalizing my sketches, I began translating my design over into low-fidelity wireframes within Figma. Due to my prior experience in GIT 540, this step of the design process was much easier than the first time I worked in Figma, and I felt much more confident in this particular project.
Additionally, when designing certain elements and the app's logo, I wanted to draw on my background in philosophy. The name Diálogos itself is a callback to this background, and I really wanted the design to reflect my passion for traditional philosophical teaching strategies, such as the Socratic method. This app was heavily inspired by my background in philosophy and the Socratic method: the image of walking alongside your professor, thinking together. I wanted to bring that feeling into Diálogos; that sense that you're walking with your professor down the street, so I purposely designed the app around that.
What I Learned
Through this project, I aligned my values and goals with my UX skills. Not only did it give me a product I have continuously worked on until I develop a fully functional application I'm proud of, but it also left me with confidence in my skills as a solo UX designer.
← Back to UX Design