Lesson Info
9. CreativeLive Case Study: Responsive Design
Lessons
What is UX?
05:33 2What is Persona?
12:05 3How to Create a Persona
39:59 4What is the Point of Storytelling in UX?
08:25 5Using Storyboards & Scenarios
14:34 6Importance of User Stories & Use Cases
34:16 7Developing Wireframes
12:46 8Exercise: Nordstrom Case Study
28:20Lesson Info
CreativeLive Case Study: Responsive Design
responsive layout. So we're using the creative live dot com website as an example. So what I mean by responsive layout is that the website design actually changes depending on your browser size. So the big one we're looking at is what happens when you're viewing it on your laptop or your desktop? Um, the 2nd 1 is when you're viewing on tablet, so the white responsive layout worse. Is that because when you're on tablet, um, your browser is actually full screen to the end of the browser to the end of the tablet. So in the in the coding of the website, we can actually specify. Okay, If the browsers screen is less in this with, show them that the tablet size, if the screen if the browser if the But If the browser size is smaller than um far, then this size, then show them the mobile with because they drilled in the mobile version. Because for mobile, you can go above a certain pixel. That's just not possible. So that's how, um, responsively as created and as you can see, just go over here ...
on the desktop. They're showing you saw side by side, so they're showing you the course detail, but then they also showing you the largest stick of it. And where do you think? What? What is the call to action here on this page? Blood in the middle of the picture right there. Play. And that one. Notice how they're the same color. Great. Um, yeah. So that's a very first read. So what is the second read? What do you what draws to your when the court. So that one? Yes. And probably that one, because they're the same size. So you might read. Oh, yeah. Okay. We'll do our boot camp. Okay, so it's February 2nd do the 20th is a.m. to 4 p.m. Cool. All right. Um, and as you can see, So when you're on tablet, nothing much changed. Really? So it's still the same thing? Um, obviously, they condensed the paragraph. They convinced the containers a little bit, so everything still fits on it. So you don't have to scroll up and right to read the full website on your tablet browser, But take a look at the mobile page. Now, we only have one column because we can't. There's no way that we can fit the all this into a cell phone. But notice how we pushed the course description now and then. We have the call to action now being on the top here. So that's what I mean by the focus, right? So when you're on mobile because you only have a limited screen space, what do you want people to see first? So you might want people to click on the play button so they can get a taste of what the courses like. But you want them to click on that. You don't want them to see the call to action after all the text, right? They might not school through those, so it's very important for them to see that first, um, other things that you can do what the website is, maybe after they scroll past a certain point, you have a fixed footer, right? Or a fixed bottom bar. We can fixed something on top. So the rspb for life classes always visible and available for the user to click on if they want that race. So, for example, if I think Pinterest does is so when Pinterest has infinite scroll, so you can just scroll through it till eternity. But what they have available is always like a back to the top button. So you can click on that and it just takes you to the top of the website so you don't have to scroll all the way top back to the top.
Class Materials
bonus material with purchase
Ratings and Reviews
ZuZu
With all due respect... We're 2 hours in and I simply can't watch this any longer. I would NEVER pay money for this course as it is. Joy seems to have a great grasp of the material and I have no doubt that working with small start-ups is a good fit for her. That doesn't mean that she's well-qualified to actually teach this course. Joy will serve both herself and her audience by getting some coaching/guidance in becoming a better speaker. The constant ums, nervous hard swallows, monotonous tone, rambling, frequent pauses while she tries to think of the next thing to say, etc is not only painfully distracting but REALLY detracts from her credibility. And the casual, cutesy way that one interacts with family and friends is not necessarily the appropriate way to speak in front of students. The initial segment was a smart way to provide an experience for the students but it went on WAAAAAY too long to make a fairly simple point. I honestly can't follow her now, she's going on and on describing users doing this and maybe they'll do that and it just doesn't make any sense anymore. I shouldn't have to work so hard to follow an instructor! On the upside, her slides are excellent. I would strongly suggest that Joy joins Toastmasters (at the very least) to improve her speaking skills, but ideally she would get some professional assistance in her entire teaching presentation: organization and delivery of material (pedagogy) and her basic speaking skills. And I don't appreciate the host "spinning" this deficiency by saying "it's a lot to follow and that's why you should buy the course"... That's just shabby! Perhaps Joy could study other extremely polished and effective CreativeLive presenters like Chris Gilbert (as a woman role model) or others like John Lee Dumas or James Wedmore all of whom are also delivering complex technical material but do it with clarity, confidence and style.
user-7a3da3
Excellent class, especially for someone new to ux design, story boarding, etc. Very good examples showing wireframes too! thank you Joy Liu. PS - remember to floss, very important for your health!!
Student Work
Related Classes
Web Design