Visual Design + Branding artwork

Visual Design + Branding

Beginner
Course

Gain practical foundations in responsive web design, from layouts and visual hierarchy to branding, color, type and so much more.

Purchase this course for $299

Or... get a discount by building a bundle with our learning paths!

Our flexible, 8-week online course provides foundations in responsive web design, user interfaces and branding. It’s aimed towards those who want to improve their digital design skills, understand what makes designs effective and design with confidence.

You’ll learn visual design elements, principles and hierarchy; the branding process (from research to final design + how to deliver branding guidelines); how to choose colors and typefaces; practical tips and ways to improve your UI design skills; how to design for responsive experiences across multiple device types, and a whole lot more!

Whether you’re totally new to design or just want to refresh and improve your digital design skills, our Visual Design + Branding course provides a unique, practical design foundation.

What you’ll learn

Design principles + practical user interface tips to help you design better right away

An end-to-end branding process — how to design your own brand and create brand guidelines for handoff

How to design responsive experiences for desktop and mobile from scratch

How to create a design system and a user interface library of components

Best practices for handoff and how to keep design consistent across teams

How to present your work and talk through your design decisions with confidence

What you’ll get

19+ hours of video lessons – Practical, go-at-your-own pace learning

Access the community – Join our Slack and connect with thousands of SuperHi students and alumni

Continued help – Help from our expert teachers and educators with years of experience in the industry

Extra homework challenges – Test your knowledge!

Real world projects – Projects that you can alter and remix to add to your own portfolio

Resources – Resources to get you started and going post-course

Who this course is for

Anyone who wants to better understand the fundamentals of digital design, branding and improve their skills.

You can be brand new to design and want a solid understanding of how to see and think like a designer, and create effective designs from scratch, or you can be a current designer, developer or someone working with design who wants to improve your processes and design with confidence. We'll teach you how to design with code in mind, so that you can work better with developers too.

What you’ll need

A computer (Windows, Mac or Linux) with the latest version of Chrome installed and a broadband internet connection.

Our course is not program-specific, but we will be teaching in Figma because it’s free and available for both Mac and Windows users.

Want to try our teaching before signing up? Join our free 'Plan, Design + Code Your First Website' course!

Syllabus

Chapter 1

Design Exploration

For the first project, we'll take what you've learned in the first part of the course to produce a themed visual exploration using design elements and principles.

Chapter 2

The Block

The Block is a city guide website and we'll be covering grids, layout and visual hierarchy to design two pages for this project, then apply typography, color, images and icons too, while designing with accessibility in mind.

Chapter 3

The Beach Collective - Brand

This project is a social good company and we'll be designing a brand from scratch, then translate it into a full visual identity and build out brand guidelines too.

Chapter 4

The Beach Collective - Website

In this project, we'll take our completed social good brand to design the desktop version of our website. We'll learn best practices for web + UI design, responsive design, tips for designing with code in mind, how to work with and hand off to developers using Figma prototypes, and designing for mobile.

Chapter 5

Camp Mate

In the final part of the course, we’ll complete a capstone project to tie it all together. The brief is to find a print publication without an online presence and use it to inspire your final project — a digital experience of some kind. We'll finish this project by walking through its completed case study.

Your instructors

Our instructors have decades of professional experience, have spoken at international conferences and have won countless web design awards.

Kristen Altomare-Ciallella

Kristen is a Toronto-based senior visual designer at Glitch, a site for making websites from scratch. She previously worked for as a visual designer for SuperHi, Nike and Huge.

Milan Moffatt

Milan is a branding and design freelancer based in Brooklyn! She previously worked at creative agencies in Brooklyn, with early-stage startups in Santiago, Chile and was part of the SuperHi team.

You might also like...

$69

What can UX/UI folks learn from Game Design?

Beginner

In just 30 minutes, learn how to analyse and test any interactive system with a game lens, using well established and very effective tools from the game designer’s toolkit.

$299

The Responsible Technology Toolkit

Beginner

Build digital services that care about people, society and planet

$149

Intro to User Interface Design

Beginner

Build scalable design systems and bring wireframes to life through UI best practices, styles, components, and more.

Free resources to get you started

View our growing collection of guides for creatives, featuring practical insights and advice on careers, making, and working.

FAQs

If you like creating things and you're comfortable working with a computer, then yes! Also, design is for everyone.

Learning new and improving your existing skills is about being patient with yourself, building up your knowledge, and developing confidence through practice and with time. We've seen our students around the world do it, and so can you.

Our beginner courses are designed for people new to the subjects. The courses are designed to build your understanding so you grasp everything you need to start applying your new skills and will also give you a path to dig deeper, if you want.

Our teaching style is practical and straightforward and you'll have support from our expert instructors and community for as long as you need!

Still not sure if learning to design is right for you? Take our free Plan, Design + Code Your First Website course or dive into our First Steps to Design guide.

I'm interested in becoming a UI designer. Is this course for me?

This course will teach concepts and practical skills leading towards a career as a UI designer. Depending on the company, role, and specialty, you may also find it helpful to gain skills in UX or code, but Visual Design and Branding is an excellent foundation for any kind of UI role.

Will this course help me design a portfolio website?

Definitely! You'll work on several projects that you can actually include in your portfolio to showcase your skills. You'll learn about creating a visual and brand identity and how to design for the web, all of which you could apply to yourself and your portfolio. We also offer portfolio and resume reviews after you've completed the course. There isn't any coding involved in this course, so if you want to build a portfolio site from scratch and don't have code experience, we recommend taking this along with our code courses.

Will this cover designing for the web?

Yes! This course focuses primarily on digital design and branding for the web, and teaches important concepts such as designing responsive websites for desktop and mobile, designing with code in mind, and working with text on the web.

In lesson 6, we ramp things up and dedicate an entire two weeks to Designing for Screens. During those weeks we also cover the basic concepts of CSS you can know what kinds of layouts are best for the web.

I want to learn UX Design in a hands-on way. Is this course for me?

This course is a foundational course for anyone looking to start out or sharpen their skills in user experience design methods. Our lessons are full of practical content and everything you do in class can apply on your own. We even have a paper prototyping lesson where you'll watch, from start to finish, how we approach design by thinking through this phase with our bare hands. A true "hands-on learning" experience! Beyond that, we do a lot of UX design and prototyping directly in Figma. You won't be guessing at how things are done - you'll see it all in action!

What will I be able to do after this course?

We're all about teaching practical skills you can actually apply. You'll get to watch as we work through an actual brief and project through the course so that you understand how theory applies. After the course, you'll be able to apply UX theory and methods to various tools to research, design, and prototype your own projects!

I'm interested in pursuing UX Design as a career. How will this course help me?

This course will teach you the theory and practical skills needed to start a path towards becoming a UX Designer. After the course is over, you'll still have our support when it comes to things like career questions, resume, and portfolio reviews, all to help you get the job and career you want. Many of our students have made career changes and advancements, and we have the success stories to prove it!

All of our courses are unlocked and available for students to start their learning and go at their own pace. We do have a suggested weekly structure for some courses, which helps some students stay on track. However, you're definitely free to jump ahead or take as long as you need!

As soon as you checkout and pay, you'll have all the courses you paid for, in your student dashboard available to you immediately. If you're busy and can't start right away - no worries, you can pick it back up later.

Yes, we do! All you'd need to do is send the links to your completed projects over to hi@superhi.com at the end of your course. We will review them, provide feedback if necessary, and then issue your certificate!

Using Figma:

Here at SuperHi, we use Figma - it's a powerful design tool that's not only free but also used by professional designers at all levels. Most design work done by the SuperHi Team is through Figma! These are some of our courses that use Figma:

We're also happy to say that our SuperHi students have access to Figma Pro. To enjoy Figma Pro features, drop us an email at hi@superhi.com