top of page

CalArts UI Design Coursework:

The courses offered by CalArts are design-specific, examining what an interface is, and what role a designer plays in creating a user interface. Courses teach students how to design using color, type, and imagery to make interfaces function clearly and seamlessly. 

Course 1: Visual Elements of Interface Design

Course 1 brings a design-centric approach to UI and UX design by offering practical, skill-based instruction centered around a visual communications perspective, rather than just on marketing or programming. 

Week 1- Part 1 summarizes the expectations of course, and looks at broad concepts and contexts for UI. In the classes, students look at examples and the relationship between coding and design. 

Description of App Created for Course: 'KatzeMatcha' is a smartphone app that indicates to people that travel with cats locations that offer safe food for cats alongside their owners. 

Are you a fellow cat owner that likes to bring your cat on adventures with you? Do you struggles finding restaurants and cafes that allow you to bring your cat inside and eat alongside you? Then this app is for you! Never worry about offending another eatery again with this handy app that scans your location for cat-approved places to eat and drink, for the both of you. 

App will use the user's location to scan for cat-approved eateries. Locations are approved by the places themselves, and confirmed with user reviews. 

Week 2 - Instructors describe the various formal elements of an interface such as: what is it, who is it for, where does it live.  Classes focus on the look and feel of an app, as well as the basic components of how visual design works in Interface design. Language, shape, color, imagery, typography, and icons were also focused on in relationship to web design, as the building blocks to creating the more complex visual structure of UI Design in our project. 

Week 2's assignment was a mood board for the app, 'Katzematcha', shown on the right. 

2F190D67-0635-49CE-96C4-E9ECEA1B9070.jpeg

Week 3- Instructors discussed how to take the static interface elements already created for the project, and begin to think about how a user interacts with them, bringing the individual elements to life. Navigation conventions were also discussed, such as menus, buttons, and icons in different states. The focus of the classes moved from how the interface looks like to how it works, responds to the user, and add interactivity to static designs. Pictured below are all the static interface elements created for the app 'Katzematcha'. 

575539EA-914F-414F-A4E4-53E45B7B4F05.jpeg
EA9A0918-96A5-444F-BF23-045C2C989D76.jpeg

Above are sketches made for the finalized version of the app, using the program 'Procreate'. Ideas were revised multiple times, and reviewed for critique with other artists of a similar caliber. 

Week 4- Students are tasked to take all individual interface components and put them together into more complex structures. Instructors elaborate upon hierarchy in interface design, conventions and expectations of contemporary interface design, and how to navigate different screens. Course ends on teaching how to build visual relationships between different platforms, create content for different screen sizes, and how to organize complex bodies of content user friendly structures. 

02F330CE-027C-4EBF-A267-31814978D446.jpeg

Finalized pdf of the coursework done for 'KatzeMatcha' can be found to the right. Course 2-4 will be added onto this page as they are finished. 

7DC40C45-6CD5-4F04-93A6-85436B310AC7.jpeg
bottom of page