I began designing this website the same way I always do: by bringing my users to life. To do so, I created user personas to get a sense for what people would want to have in a language learning website. I identified a few key pain points and potential necessities that should be implemented in my design - an easy language switch, a “watch later” list, an easily accessible screen reader feature, and more. With my ideas swirling, I conducted further research into similar products and competitors to see how I could possibly improve what they were lacking. Interactive learning elements became a key feature I wanted to implement by the end of my research. Now I had plenty of ideas and it was time to jump into paper wireframing.

Paper wireframing has become an essential step in my design process. Being able to rapidly draw different iterations of my website gives me a sense of the important features without committing too much to one thing. They remove the pressure of perfection and let the creativity flow.

From there, I honed in on elements of my designs that have been the most consistent and are the most useful for users. I was then able to translate these into my low-fidelity digital wireframes in Figma. With my lo-fi digital wireframes complete, I produced a loose prototype and checked that the flow of my website made sense. Once the low-fidelity prototype has gone through some testing and adjustments, it’s time to move on to mockups.