Click here to learn more about BrainStation’s User Interface Design course.
Week 4 of 10 has come and gone! Before starting this UI Design journey, I really didn’t have a strong grasp of what UI Design entailed…beyond Adobe Photoshop, typography, and “picking website colours” that is. Overall, I would say my favourite aspect thus far has been unlocking the layers of UI Design (Photoshop pun intended). In week 4, we have now covered several UI elements. For example, the main topics covered this week were responsive design, breakpoints, and wireframes. Now, I’m not an artist by any means, but the wireframe activity we did in class really piqued my interest.
“A wireframe is a document that represents the skeletal framework that showcases components in an interactive product (e.g. website of mobile app). A wireframe is like a blueprint.” (Credit: BrainStation UI Design Course Slide 41)
Creating a wireframe is actually a really crucial process of building out an interactive product. It allows you to break down the interaction of different elements and consider the goals you have for the end user. The nature of building out a wireframe is appealing to me because it doesn’t require an intense level of artistic detail. Instead, it’s done in black and white (or gray-scale). Even while Hubert (our awesome course instructor) was going through wireframe concepts and objectives, I got excited and immediately started to jot down some ideas for my course project.
The process of creating a wireframe for my homework this week helped me take my design ideas and convert them to paper form. This was surprisingly challenging. I thought my vivid mental images would easily transform to logical and user-friendly wireframe. However, when I sat down to build out my website framework, I found this process to be more difficult and time-consuming than I initially imagined. It gave me a stronger appreciation and awareness of the number of iterations and versions that it takes to develop and design a great website.
Over the coming weeks, I’m excited to continue to dive deeper into everything UI Design. I’m especially looking forward to integrating my newfound UI knowledge into my course project development. My goals for this course continue to evolve. By the end of the 10 weeks, I’m eager to have a full website design and framework, having leveraged the different elements I am learning in this course.
Until next time!