This week you're going to create your own Prototype. So you'll pick a set of one or more user-stories and one is just fine, and you can modify either of those or not. You're going to create a working Prototype and my advice is start simple, get something that you're happy with and then layer in additional details. Make sure that you have a nice clear design intent and also don't be hesitant about posting questions. Now, here are a few hands-on things that I'm going to show you how to do that may come up as you work on your Prototype. Let's dive in and look at the details of how you're going to go from idea to code. Now this design brief that you'll find in the course resources is the idea part of that. This goes through how HVAC in a Hurry has aligned with the company's business model. Which means this business model canvas and their product market fit the specific area that the team is focused on, looking at their cost drivers and making their service design better through a service platform. It looks at the different personas and how they interact together, and what their underlying jobs to be done or problem scenarios are. Got Tedsometimes called Trent here. This is the problem scenario, jobs to be done they're focused on and then these other sections go through how that interacts with what's going on with Frida the customer and Dan the dispatcher who Trent works with to get dispatched. Then we have our various epics and the one epic where we've been detailing and playing with. Then there are the comparables that you saw. I think you're familiar with them their prototypes the fact that they went with concept two. Then finally there's the section project ideas on going from idea to code. Now this this is for both course one and course two. So there are a couple of these like for example, this one difficulty seven it's really intended for course two, where we start with JavaScript. Now all that said, there are a couple of options, one is create a help page. So take this menu here and just link to another page that has some help content. There's even a sample help content that you can grab off this Google Doc. So you don't have to spend time trying to think about what that might be. As a reminder if you go to slash show you can bring your JSFiddle full screen which is kind of neat and fun for making your demo and whatnot. Then the next one is create a parts detail page. So a layout something looks like this or whatever incarnation of it you think makes sense. If you want to update the sample files in Balsamiq, you can open those in Google Drive here and update them, or choose your own adventure. You may want to update this brief, so you may want to make a copy of it and create your own user stories. If you're interested in that process of changing the idea around as you go from idea to code. That said, regardless of whether you use the existing inputs which is perfectly fine or you create your own make sure you've got at least a user story and probably a Prototype and that you also submit those with your work for the peer review and the URL of your JSFiddles. These are really important because it's important for obvious reasons that we've talked about. Also because it's easy to get lost in all the hooks and dials and things that you can play with. You don't want to let those drive your idea, you want to let your idea drive your focus on what hooks and dials you want to use. So be careful about that. The other thing I notice you see if we go back. If we look at this you can see there are various comments in the HTML actually no they are not comments in this version. Let's add a comment. So here's what comments look like in HTML. They look like this. They have this notation. How do we remember that? Either we remember because we just remember by habit and practice or we Google, create a comment in HTML and it'll be right there waiting for us. No point in committing into memory if you're not using it. This is how a comment looks in CSS it uses a different syntax. JSFiddle wants to see a little bit of a tighter view of the negative space here. Doesn't want to see them adjacent to these things. Oops I put that negative space in the wrong place. There we are nice happy comment in CSS. You can see they use different notation. That is a good way to talk about the more detailed parts of your code to your peer when you do your submission. I think those are the big things. My advice is pick something small and get it all the way down to your satisfaction and then add something else If you have another idea that you want to pursue. What you don't want is something that gets big and complicated, and the idea is changing a lot along with implementation. That's why it's easier to kind of get the idea part and the coding part a little bit confused and just to end up sort of confuse yourself which is not what I want for you guys. So those are some ideas on getting started. Good luck with your Prototype and I'm looking forward to see what you do.
