Designing a website - Episode 1: Planning & site map!

The very very first thing I do when approaching a new design project is plan (shocker!). For a website, that means sitting down and thinking through firstly what the goal is for the site and why visitors might be on it, and secondly what pages and templates will need to be designed in order to bring it to life.

In this video you'll see me make a plan for my website, both for the full site map of my new blog and portfolio, and also for an "MVP" simple landing page I'll be starting with first.

Hope you enjoy the video and are excited about the series!

// LINKS

Concepts (the app I'm using in the video):

Webflow* (what I'll be using to build my site):

Please remember to click subscribe if you'd like to see more of my videos.

--------------------------------

// WANT TO SUPPORT MY CHANNEL?

Become a ✨channel member✨ and get a cool icon next to your name in livestream chats, plus priority replies to your comments. Just click 'Join' (it's next to the subscribe button)

Sharing my videos or recommending my channel to a design friend is also very much appreciated! :)

--------------------------------

// ABOUT ME

I'm Charli and I'm designer from New Zealand currently living in Valencia, Spain. I’m the Creative Director at a remote tech company called ConvertKit and I posting videos about the design projects I work on and the tools I use, as well as vlogs of my life as a designer. I regularly livestream what I'm working on in Coworking Club streams. Welcome to the channel! Please subscribe and say hi in the comments, and maybe we'll see you in the live chat on the next stream.

--------------------------------

// MORE

--------------------------------

// TECH & TOOLS

💻 Software I use:

Links marked with a * are affiliate links. I can't believe you read the whole description box! You get a ⭐️

[kydune]

The way this has cleared my skin. Thank you

[Kate-ismz]

Who the hell dislikes videos like these?! Like, why is there always THAT person... this is a very good, informative and insightful video, who would anyone ever have a problem with that, jeez... anyway, great video, subscribed!

[imenziani]

I love how you make it feel simple and possible for any one to do. In this series I think you're going to show us or give us ideas on how to think when wanting to design a website more than how to actually do it which is great. I really like it. Keep up the hard work.

[ArielBissett]

This is great! It's always so good to understand what goes on behind the scenes!

[jalabi]

Best part of it was when you decided to make an MVP site in order to not get overwhelmed. Looking forward to the rest of the series.

[themuddabeyonceshow]

I know this video is 3 years old but it was super helpful and not overwhelming.

[Paigeboyd]

So glad to see a series like this! I study Interaction Design and have been building websites for three years now but it's always interesting to see other peoples' process - thank you for doing this! :)

[heidykatheryn]

Great this is what I was looking for, someone who walk me through step by step. Thanks youuu

[hannahferreter]

Loved this video and the idea for the series. I learned the hard way of the importance of an outline/site map while designing the drama department website for my school. I was so excited about the actually designing that halfway through the project I was left with multiple pages floating in the menu which did not need to be there. After creating a site map the website all came together. Thanks for the video! I can't wait for the next one!

[jeanwangg]

those process and details about starting a business is going to be so helpful and crucial to so many freelance designers like me! these are all necessary but not a lot of individuals post about them. it'd be great to see a designer be transparent about that! <3

[davehansel]

I really like the way you explain things! I have someka's sitemap generator to create sitemap diagrams. Easiest way to create a sitemap chart imho. Thanks for the video! On to the episode 2:)

[steparko]

I find that when I’m on my phone or iPad, using a mind mapping app allows me to record site map ideas easily and efficiently. It shows the basic page linking structure that I can come back to and reference later.

[chris-adams-tas]

This is a good explanation of the process of determining Site Architecture IMHO, thanks for sharing Charli.

[andru]

Interesting to see how you work :) Whenever I built websites in the past, I always made a quick list of pages and jumped ahead to sketching out the pages themselves on paper but it's so obvious and makes sense to build a site map like this first!

[jethrojohnson]

Thanks Charli! I will be using your video for flipped learning to broaden the scope of understanding of my students about site structure.

[manoharr]

I do have a non-commercial website that needs redesigning as I am including diverse and expansive material. Your thinking as how to organize content is of great help to me. Thank you very much.

[adriankenepah]

Super rad idea, Charlie! Really looking forward to this series. I love learning about different processes and methods people use for building out websites. One thing I do, which may be overkill, is a whole discovery process of the site. Really diving into the type of people who may be visiting the website (a fan, causal visitor, company looking to hire, someone looking for inspiration, etc). Obviously this varies throughout the type of project you’re working on, but it helps with the design and UI/UX portion of the website by finding the commonalities with each individual visitor and basing my structure and content off of that.

Anyways. Keep killing it! Again, really I looking forward to the next part of this series!

[sasavlog]

This is literally saving me from misery because I have an assignment about this

[Madwolfx_]

10:50 min well spent. Great content. 💪

[rosetyler]

Thank you for taking the time to make this, Charli. You are an inspiration!