OVERVIEW
what is it?
a perfume recommender + storyteller based on a user's descriptive & visual inputs
intent
to serve as a fun tool for discovering new perfumes and attaching a narrative based on the user!
DESIGN
for ideating this design, i was heavily influenced by the organic nature of scent via its raw materials and felt drawn to create a visual language reflective of that. and so, there are decorations of flowers, an orange, and a tree branch created on procreate, and the containers were designed topossess a quality of asymmetry and softness.
BUILD
REFLECTION
design
i definitely had a lot of fun working out the visuals of the piece! while it is clear i had a lot of different ideas (as seen in the figma file), each iteration i felt built upon each other to create something a little newer, a little fresher each time.
build
OPENAI
this process has been a bit of a big rollercoaster (think king da ka).... the openAI API was quite daunting for me to use, since it was not as straightforward as the NYT one, and i was still quite new to incorporating APIs into my projects. I did run into a lot of roadblocks in trying to get the API to work, but i still remember the feeling of excitement and awe i felt when i got my first ever response from the API. from that point on, it was a mix of figuring out how to better steer my prompts so that it would give me better answers, and then also integrating my envisoned design into the mix.
GEMINI PRO VISION/FLASH
after some time with openAI's API, i thought it would be so cool to also incorporate the same principle of text to perfume rec + story via an image as the input instead of text. and this was around when gemini pro vision was still kind of new and all the rage (may 2024), and when i saw that it was able to do image analysis, i thought it would be a great tool to make my idea happen. however.... not all goes to plan, since i was not able to successfully integrate the model.... i ended up putting it aside for quite a while, and only revisited this project around early january 2025 after coming across it on my desktop again. with a few months of extra wisdom up my sleeve, i decided it was time to tackle this again. and turns out, gemini pro vision was deprecated (rip) and gemini flash was the new kid on the block. and i will not lie, i also encountered a lot of roadblocks in this new attempt (constant 503 errors, server errors, etc), but at last, the model gave me exactly what i wanted.
conclusion
overall, i am happy with how much i learned from this project. while it did take a long break in between start and finish, i am proud of myself for not completely abandoning the piece. i got the chance to learn a lot of new things, like integrating ngrok so that the server on my local laptop can be accessed online, and also just a better understanding of how to use AI APIs in my project. seeing the capabilities of AI in web projects, even for something as trivial as this, it makes me super excited to experiment more with AI in my future endeavors!