Design an efficient flow to order cakes from a bakery
Design a website for finding and viewing cooking tutorials
Design a responsive website for finding and viewing make-up tutorials
Design a responsive website for finding and viewing fashion tutorials

I decided to go with designing a website for fashion videos; like a fashion YouTube. I shall call it… well, I have no idea what to call it. That will have to come later.

Next, students learn about what responsive design is. Essentially, it’s making sure that websites (and apps) work on a variety of screen sizes and devices, like desktop screens, phone screens, tablets, and all sizes each device comes in.

Then we’re introduced to Adobe XD, which we’ll be using instead of Figma. We’re exposed to both programs in this course to broaden our UX software knowledge. This is great. Although, the instructor does also tell students that anyone using a Chromebook will have to still use Figma, because XD doesn’t actually work on Chromebooks. I didn’t know that, but fortunately, I’m not using a Chromebook.

The next parts involve quickly covering how to empathize with users in order to design a good product. We talk about empathy maps, pain points, and user journey maps again, as we have in the previous courses. Then we discuss user personas, user stories, user journey maps, and problem statements.

So week one is esentially a refresher and there is no assignment or quiz due this week. Although, there were quite a lot of videos and reading, and it ended up taking me almost two days to complete, but I didn’t rush through it.

Week 2: Ideate Solutions to the User’s Problem

Week two of Responsive Web Design in Adobe XD is all about creative a competitive audit for the site design, then creating a sitemap. We start with the competitive audit first, identifying both the direct and indirect competitors for the website we will be creating.

After creating the competitive audit we move on to doing our How Might We statements then doing some Crazy Eights exercises to ideate; both of which were covered in a previous course. Next we discuss different website structures. The instructor talks about the four main types of website structure; the hierarchical model, the sequential model, the matrix model, and the database model.

Next, we learn about site maps, which will be the main project for this week. We’re meant to base our site map on one of the website structures we’ve already learned.

For the peer grading portion of the assignment, I was pretty happy with the quality of work submitted. Every site map I saw was quite well done. This is impressive considering students weren’t given a template this time, and had to create something entirely from scratch in a program of their choosing.

Week two took me another two days.

Week 3: Create Wireframes

Week three of Responsive Web Design in Adobe XD begins with some common site layouts; single column, multi-column, box layout, featured image layout, asymmetrical layout, grid of cards, and tiered layer cake layouts.

Then we discuss wireframe basics before staring to make some paper wireframes for our site designs. After that we move on to responsive web design in Adobe XD. Students are shown how to create a paper wireframe for smaller screen sizes so they can make their site designs responsive for all screen sizes.

Students then learn how to create digital wireframes in Adobe XD, which is relatively easy if you’re already familiar with other Adobe programs.

The project for this week is to create digital wireframes of at least two pages on a desktop screen, and at least two on mobile as well. I did that, then sent it off for grading.

Next, I got to mark some student projects. At this point in the program I feel that only some of the students are grasping the basic design principles, but certainly not all of them. That’s okay, since they’re still learning, and this isn’t a visual design program. Some of the projects are pretty rough though.

One project I got to grade was forty pages long. That’s right. 40 pages of wireframes. I didn’t actually grade this though. I flagged it for resubmission, because that is ridiculous. Most of the pages were just plain grey rectangles and nothing else. It was poorly executed overkill. Then someone else submitted what appeared to be their wireframes from one of the previous courses, since there were no desktop layouts to be seen, just screens for an app.

If it’s any indication of how seriously many of the students take this course, the only feedback I received on my project was “goo”. But I got full marks, so I can’t complain that much.

This week took me about four days; most of which was spent creating the home page design then adapting it to a mobile screen size.

Week 4: Create and Test a Low-Fidelity Prototype

Week four of Responsive Web Design in Adobe XD is all about creating a prototype from your digital wireframes. Students are shown how to create connections between buttons and pages in Adobe XD. I’m once again happy that this is very similar to how it’s done in Figma.

After creating a low-fidelity prototype, students are then asked to conduct a usability study; just like we did with the previous app project. After the usability study, we consolidate all the feedback, then figure out which feedback needs to be addressed in our designs.

This week took me about two days to do; which was mostly spent on refining my design, making it interactive, and then testing it about a hundred times to make sure it worked as it should.

Week 5: Create and Test a High-Fidelity Prototype

In week five of Responsive Web Design in Adobe XD students get to turn their low-fidelity prototype into a polished, high-fidelity prototype. We review visual design principles again, work with design systems, and go over the general details on how to create a high-fidelity mockup.

I went through this information pretty quickly and spend most of this week working on my mockup and functionality. I had a lot of trouble creating buttons in Figma in the last course, but fortunately, In Adobe XD, buttons are really, really easy to make with multiple states (hover, tap, etc.)

Students also go into how to use external design systems in our mockups, like Google’s Material Design System, which is what I used for icons.

The actual design of my site was done pretty quickly; as in I didn’t spend much time on the site name, logo, colours, or other visuals, since I wasn’t being marked on those. When I put this project in my portfolio, however, I’ll probably spend a bit more time on that, but with a proper visual strategy.

Week 6: Document Design Work and Search for Jobs

Week six of Responsive Web Design in Adobe XD is all about presenting your design work the same way we did in the last course; via Goggle Slides document. Although, this is actually not for marks. The assignment for this week is just a quiz. We also talk about how to hand off designs to the engineering/R&D/Web dev team from XD.

The next few lessons, surprisingly, focus on getting a job in UX. I would expect this in the last course in the UX Certificate program, but not the one before it. The instructors go over some of the UX job titles that exist, what those job titles mean regarding job responsibilities, then discuss the type of jobs you can get.

To start, the instructor covers internships. I am not a fan of internships, because far too often, they are unpaid; especially in tech companies. Then there are apprenticeships (which I do like the sound of), and freelancing. Freelancing is great, but I do not recommend freelancing right out of school without other relevant experience. Anyone fresh out of school, without other job experience, is not adequately prepared to handle being a freelancer. It’s just too much to take on while you’re still learning design and UX; because school DOES NOT teach you everything. Also, it’s unlikely a brand new designer’s UX portfolio would be good enough right out of school to land any decent clients.

I learned more working than I ever did in design school, and I unlearned a lot of bad habits that design school taught me.

Next, the instructor says that another good option is to offer your services free of charge to a non-profit… for the exposure. It would be fine to help out companies who are doing good in the world that simply wouldn’t be able to pay you, but many non-profits absolutely could afford a UX or graphic designer, and far too many people think that exposure is enough. Fun fact: exposure means very little when your rent is due.

Next, students are taught about how to write a resume… for some reason. Did they run out of content to teach and decide students should be able to get a job after only six courses in UX? From what I’ve seen from doing peer reviews, most of the students taking this program are not ready to look for jobs yet. Their work is rough looking and lacks intuitive functionality. Not all the students, but at least most of them. Instead, I’d actually like to see a separate course, from Google, that was all about how to get a job.

It took me a little over a day to do week six, though I didn’t spend much time on the case study for the website since I want to do it properly when I do it for my portfolio website.

Responsive Web Design in Adobe XD – In Summary

Overall, Responsive Web Design in Adobe XD actually felt more a summarized version of the first five courses in the UX certificate program, but this isn’t a bad thing at all. It was great to reiterate a lot of the topics that were covered in the previous courses so the information really gets learned.

I also enjoyed getting to learn a bit more about Adobe XD. It really seems easier than Figma in some ways; like how easy it works with other Adobe programs, and how simple it is to make different button states. On the other hand… there is no hand tool in XD. Why?

I didn’t really understand why so much ‘job searching’ was include in this course; mainly because it’s not the last course in the professional certificate program.

Now I’m finally on to the very last course in the UX certificate program: Design a User Experience for Social Good & Prepare for Jobs.

Prepare for jobs? Again?

Are you interested in taking Responsive Web Design in Adobe XD? Have you taken the other five courses? If there’s anything you want to know about this course or the others, just let me know in the comments below!