Day 3 of 30 Day UI/UX Design Challenge: First Lo-Fi Web Page Design! ๐Ÿ˜ฎ

Posted
Tags
UI/UX 30 Day UI/UX Design Challenge
Share

๐ŸŽจ Today’s design task

Despite feeling a bit tired from a late night, I was excited about today’s task: creating a wireframe for a medieval artist’s portfolio website. It’s a two-day project, but my partner helped me break it down into manageable steps. As a fan of medieval art (thanks to playing Pentiment), I was thrilled to work on this.

The task:
Create a lo-fi design for a single-page portfolio for Andreas Maler, including a header, hero section, about, portfolio gallery, commissions, testimonials, contact form, and footer. I decided to make a lo-fi design of a modal to prepare for tomorrow.

๐Ÿš€ My design process

  1. Got inspiration from the Pentiment video game website.

  2. Created a mood board using images from the website.

    ยฉ 2024 Obsidian Entertainment, Inc.
  3. Sketched initial ideas on my new iPad (a surprise gift from my partner!).

  4. Transferred my sketch to Figma, making minor adjustments.

๐Ÿง  Challenges and solutions

  • Iโ€™ve been designing sections, not an entire web page, so it was easy to go right ahead with hi-fi design. Today I learned the importance of doing lo-fi design to see the entire page so if I am actually designing a web page or a whole website, I know which section I am working on and whatโ€™s left. It helped me see the big picture.
  • Working without colours was a bit dull, but I recognised its importance in the design process.

๐Ÿ–ผ๏ธ The final design

My lo-fi design is simple and straightforward. I’m excited to work with colours and design the art section tomorrow!

๐Ÿ’ก What I learned today

Lo-fi design is quick but valuable. It helps me appreciate colours and typography more. I realised I’ve been doing this step on my sketch in previous days, but I’ll make sure to include it in Figma from now on.

โฐ If I had more time

  • I’d spend more time on the Hero section to make it more engaging, perhaps centring the self-portrait.

๐Ÿ’Œ Any thoughts?

What are you working on lately? I’d love to hear your thoughts on my design or any advice!

Thanks for reading until the end of Day 3 of my challenge. See you tomorrow for Day 4!

With love and light ๐Ÿซถ๐Ÿป
Yoshie

P.S. I’m so grateful for my new iPad. As a child, I enjoyed drawing but gave up thinking I had no talent. Now, 20 years later, I’m giving it another shot, focusing on learning rather than relying on talent. I might share some artwork here too!

Related articles

Day 10 of 30 Day UI/UX Design Challenge: Icon Design! โžฐ

๐ŸŽจ Today’s design task Last night, I discussed my task for today with my partner. I’m grateful for his input, as he’s always thinking about how I can upskill as a designer. ๐Ÿฅนโค๏ธ Todayโ€™s task: Itโ€™s a 2-day series focused on icon design! ๐Ÿš€ My design process Understanding the task: I started by reading the task requirements. Research: To understand how to make consistent icons, I โ€ฆ

Day 6 of 30 Day UI/UX Design Challenge: Decoding Cat Body Language ๐Ÿˆ

๐ŸŽจ Today’s design task Another day, another challenge! Today’s task pushed me out of my comfort zone, focusing on cat body language. ๐Ÿš€ My design process Researched cat body language (despite having a cat, I realised there was a lot to learn!) Sketched initial ideas on paper Selected ethical colour palette Chose font pairing: Poiret One & Montserrat Found and incorporated cat images โ€ฆ

Day 29 of 30 Day UI/UX Design Challenge: Redesigning the Registration Process for Seedlang ๐ŸŒฑ

๐ŸŽจ Today’s Design Task Today, I focused on redesigning the registration process for Seedlang, a language-learning app. The current design isn’t very accessible, so my goal was to make it smoother, more engaging, and user-friendly! ๐Ÿ–ผ๏ธ The Final Design This task took me the entire day, and I felt a bit slow at times, but Iโ€™m reminding myself to be patient. I used Cari and โ€ฆ