Poppy Coffee Co.
Poppy Coffee Co. is a fictional company I invented for the express purpose of learning Figma backwards and forwards. I had previously used the software for a variety of freelance projects, but with the Poppy Coffee Co. website mockups, I sought to push my knowledge towards legitimate mastery.
Click on an image to enlarge it.
My Process
I used Bring Your Own Laptop’s Random Project Generator to create my brief, with delightful results. I could make a millennial-centric coffee website in my sleep, but one with an older, wealthier audience in mind would require research and careful thought.
In short, it was perfect!
My work began with a quick lo-fi mobile mockup, then progressed to a mood board and palette. My goal was to evoke both comfort and luxury with a warm, vibrant palette and a clean layout. Absolute simplicity and straightforwardness was key.
Next came the logo. My typical software for vector art is Affinity Designer, but I challenged myself to create a beautiful and evocative logo entirely in Figma and succeeded. (I did, however, resolve to return to Designer were I to make anything more complex.)
Final Delivery
The hi-fi mockup includes photographs from Unsplash, a few handmade icons, and plenty of interactivity. I made frequent use of components, styles, and properties, a bit of extra initial effort that proved more than worthwhile by the end.
Creating the mockups for Poppy Coffee Co. proved a delightful use of professional downtime. My efforts towards using industry-standard workflows and advanced Figma functionality proved fruitful, as the interactive prototype plainly demonstrates. In the future, I hope to add a desktop version.