Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Joseph Torres
6,282 PointsIs there a video on Team Treehouse that shows the steps you would take when starting a project?
So if I want to start a project, what is the best way to approach it? For example should I demo it first in Gravit Designer? I've seen people use shapes in Word to Pseudo code it so to speak. I keep finding myself thinking of an idea and not sure how to properly go about it and then finding another idea and so forth.I guess Im a little confused.
4 Answers
adefee
4,705 PointsDon't know that there's a video that covers all of it, but there are probably pieces of it covered here on Treehouse.
Are you trying to take an idea and turn it into a product (e.g. starting from scratch with just an idea and no research or market validation), or have you already validated your idea and you're just having issues planning the flow/design/dev of the product? Give me an example of an idea and where you're currently at with it and maybe I can give you a bullet list of things you can 'check off' as you go.
adefee
4,705 PointsRight, you're talking about wireframing. Before you do that, you might also want to figure out the flow of the app/site.
Flowcharts are used to (literally) outline the flow of an application or website. They don't have to be as deep as this one, but the idea is to get a feel for how a user will navigate. In doing this, you'll also end up with a better understanding of how you expect people to use your app/site.
Once you've done that, you'll want to progress into wireframing - which is what you are talking about in your post. This is why you layout the individual pieces of the pages/app themselves. Nav/header, footer, content areas, etc. Tutsplus has a good, albeit a bit dated, article on beginning wireframing at https://webdesign.tutsplus.com/articles/a-beginners-guide-to-wireframing--webdesign-7399.
After those two things, you'll refine your design a bit and then jump into basic prototyping, then likely an MVP.
Joseph Torres
6,282 PointsThank you so much for you're reply. BTW, what program do you use to build user interfaces?
adefee
4,705 PointsFor basic drafting UI/X, pallettes, and flow, I like to use Adobe XD (part of creative cloud) as it integrates well with other Adobe design products (like Photoshop and Illustrator). There are plenty of others products, both free and paid, out there that let you wireframe and prototype if you can't afford a CC subscription. Just google 'prototype online' or 'wireframe tools' and you'll get dozens of solid results.
Joseph Torres
6,282 PointsJoseph Torres
6,282 PointsHello, thank you for you're reply. I assume that for example a developer who has an idea tries to draw it out or make a demo on Illustrator then create a sheet that show if the person does this then do that an so forth. There may be steps that are missing because I dont know this area. I would love bullet list if at all possible. Thank you.