IXD303 – Prototyping

The final step in my project this semester is prototyping. I got used to using Figma as a prototyping app in the last semester, so I was pretty confident when starting this part of the process.

One of the things I wasn’t too sure on how to do was horizontal scrolling. There is a section in my app where the page is supposed to allow you to scroll left and right, but only in one section of the page, like a sideways list.

Figma’s channel on YouTube has been really helpful to me in the past, and I managed to find this video explaining the exact thing that I wanted to do. I was able to create a shot with components in it, and allow horizontal scrolling through the overview section on prototyping.

Next, the rest of the prototyping process was pretty simple. It was repetitive, I admit, but nothing frustrating.

I made sure all of the navigations into new pages were set to having a dissolve animation. I thought this would give the app a much cleaner and polished feel, as each new page isn’t jarring.

I also wanted to make the input pages feel like they had slid into the screen, as if sitting on top of the home screen, so I changed their navigation animations to Move In and Move Out where appropriate.

With the prototyping now complete, that was the app pretty much finished. I went through the prototype presentation a few times, clicking on all the interactions and making sure everything was working the way it should.

Overall, I’m extremely happy with how the prototyping turned out.

Leave a Reply

Your email address will not be published. Required fields are marked *