— PROJECT NAME
Vaccine Assistant
— ROLE
Tech Design/UI Programmer
— DATE
August, 2025
For the Vaccine Assistant project, we were tasked with creating a prototype in just two weeks. The goal was to design a proof-of-concept application that could assist users in navigating vaccine eligibility requirements and appointment scheduling.
I contributed by designing the user interface and programming the backend logic to parse eligibility criteria. The interface was designed to be intuitive and accessible, with a focus on clear instructions and ease of use. On the backend, I implemented logic to ensure that users received accurate and personalized guidance based on their input.
Despite the limited timeframe, we successfully delivered a functional prototype that demonstrated the feasibility of the concept. This project allowed me to refine my skills in rapid prototyping, user-centered design, and backend development under tight deadlines.
Comprehensive project playthrough
For this project, I was tasked with programming systems to generate specific text responses based on user input. The responses were predefined but tailored to the user’s input to ensure they could access the relevant information they needed. Additionally, I formatted the user interface to resemble a phone’s messaging software, providing a familiar and intuitive experience. This included careful attention to layout, typography, and interaction design to mimic the functionality and aesthetics of modern messaging applications.
For this project, I implemented a variety of systems to enhance user interaction and provide dynamic responses. I developed functionality to interpret and categorize user input, matching key phrases like “yes," "no," and "more information” for efficient, context-aware responses. This included logic for updating the application’s stage, processing dynamic user feedback, and ensuring that the system responds appropriately to user input. I also created a dialogue system that cycles through AI responses and adapts based on user choices, handling both initial prompts and follow-up queries. To ensure seamless communication, I built a system for generating and updating text bubbles in the UI, including audio feedback and handling interactive links within AI messages. This work contributed to a highly responsive and immersive user experience.
This code snippet is part of a larger system designed to process and interpret user input for a responsive application. In this specific section, I implemented logic to identify key phrases within user responses, such as “yes," "no," or requests for "more information.” The system uses case-insensitive matching and simulates a short delay to create a more natural interaction experience. This functionality ensures that user input is accurately categorized, enabling the application to provide appropriate feedback or actions based on predefined criteria.
This code snippet is part of a larger system designed to process and interpret user input dynamically. In this section, I implemented a system to match user responses against a dictionary of keyword arrays. If a keyword is detected, the application updates its current stage and provides an initial prompt for that stage. The logic includes case-insensitive matching, efficient loop-breaking to optimize performance, and fallback handling for unmatched responses. This functionality enables the application to adapt to user input in real-time, delivering a more context-aware and responsive experience.
This code updates the AI’s text response in an interactive dialogue system. It handles different types of responses based on the player’s input, cycling through pre-defined answers or providing additional information. When the input is the initial prompt, it sets up the first response and acceptable answers for the current stage. If the player’s input matches an acceptable answer, the code either cycles through multiple responses or provides more information. If the response is invalid, the AI prompts the player to try again. The response is then added to the chat box, ensuring a dynamic and engaging conversation flow. This approach helps create an interactive and responsive dialogue system where the AI adapts based on user input.
This function adds a new text bubble to the chat UI, either for the player or the AI, based on the provided text prefab and text content. It instantiates a new text bubble from the prefab and assigns the passed-in text to the bubble’s TMP_Text
component. The function then updates the UI layout by forcing a rebuild of the bubble’s RectTransform
. If the message is from the player, it plays a sound indicating a message was sent; if it’s from the AI, it plays a message received sound. Additionally, if the AI’s message contains a link (identified by “https”), a functioning Link
component is added to the bubble to handle interactions. This ensures that the UI dynamically updates to display messages while also managing player and AI message behaviors appropriately.
In order to achieve the authentic phone messaging aesthetic for this project, I had to quickly learn and master a wide range of new UI tools in Unity, including layout groups, layout elements, and content size fitters. These tools were crucial for ensuring the dynamic and responsive layout of the messaging interface. Additionally, I explored and implemented packages, such as serialized dictionaries, to streamline our workflow and enhance communication within the development team. Through this process, I gained valuable experience in optimizing UI functionality and improving team efficiency, which significantly contributed to the overall success of the project.
For this project, we utilized ayellowpaper's serialized dictionary package for Unity (link), a powerful tool that greatly enhanced our ability to manage complex dictionaries. This package allowed us to customize and visualize our dictionaries directly within the Unity editor, streamlining our workflow. Given the extensive size and depth of the dictionaries we were working with, this package proved invaluable in helping us organize, navigate, and efficiently understand the data structure, ultimately improving both our development process and project management.
The Layout Element component was key to this project’s visual success, as it allowed me to control the size and flexibility of individual UI elements, like message bubbles, within the overall messaging layout. By setting preferred widths, heights, and flexibility values, I was able to ensure that the message bubbles resized properly based on the content and adapted to different screen sizes. This helped achieve the desired phone messaging aesthetic, where each message fits neatly in the conversation flow while maintaining an organized and user-friendly layout. The experience greatly expanded my knowledge of Unity’s UI system, enabling me to create polished, responsive designs for interactive applications.
For this project, I learned to use Layout Groups in Unity to manage the overall organization and alignment of UI elements within the messaging interface. By implementing HorizontalLayoutGroup and VerticalLayoutGroup, I was able to ensure that the message bubbles automatically aligned correctly, whether they were from the player or the AI. This allowed me to easily structure the conversation flow and adjust the layout dynamically, so the UI adapts as new messages are added. The use of Layout Groups streamlined the process of organizing the messages without needing to manually position each element, which was crucial for creating a clean and efficient interface.
I also integrated Content Size Fitters to ensure that UI elements, particularly the message bubbles, automatically adjusted to fit the content inside them. By attaching Content Size Fitters to the message bubble elements, I was able to make sure that the size of each bubble dynamically expanded or contracted based on the text length. This helped create a more flexible and responsive UI, where the messaging elements looked natural and properly aligned, regardless of the message content or screen size.
Key Learning/Takeaways
Throughout the project, I learned to optimize both the technical and workflow aspects of UI design. I integrated serialized dictionaries to streamline data management, which greatly improved our workflow. This experience deepened my understanding of both UI design principles and the importance of effective teamwork and communication when developing a product under tight deadlines.