1 00:00:00,000 --> 00:00:01,440 How did it go? 2 00:00:01,440 --> 00:00:04,423 Were you able to tackle the sitemap challenge? 3 00:00:04,423 --> 00:00:08,922 I'll walk you through the process I went through to create my sitemap diagram. 4 00:00:08,922 --> 00:00:12,902 It will probably be different than yours, and that's okay. 5 00:00:12,902 --> 00:00:18,366 First, I researched a few elementary school websites to see what features and 6 00:00:18,366 --> 00:00:23,191 pages they had in common, while keeping our persona thandy in mind. 7 00:00:23,191 --> 00:00:26,216 I listed them out in this doc to keep track. 8 00:00:26,216 --> 00:00:31,599 I thought things like the calendar, staff list, student handbook, 9 00:00:31,599 --> 00:00:37,271 and more, would all be necessary for Northeast Elementary's website. 10 00:00:37,271 --> 00:00:40,756 Next, I added any additional features or 11 00:00:40,756 --> 00:00:46,331 pages I thought the audience might want on this website to my list, 12 00:00:46,331 --> 00:00:49,632 like photos and videos and donations. 13 00:00:49,632 --> 00:00:54,195 Now with everything listed out, I'm going to organize the pages and 14 00:00:54,195 --> 00:00:57,901 features into logical groupings to create my site map. 15 00:00:57,901 --> 00:01:02,086 There are many great tools out there to create a sitemap diagram, so 16 00:01:02,086 --> 00:01:07,480 feel free to use a diagramming tool of your choice, or even a design tool. 17 00:01:07,480 --> 00:01:09,643 I'll add a link to draw.io, 18 00:01:09,643 --> 00:01:13,631 which is the one I am using in the teachers notes below. 19 00:01:13,631 --> 00:01:18,003 First, I'm going to add each item to its own box. 20 00:01:18,003 --> 00:01:22,283 Then I'm going to organize them into groups that makes sense. 21 00:01:22,283 --> 00:01:27,135 Side note, a great way to do this is to have users do the card sort to 22 00:01:27,135 --> 00:01:31,307 see the organization that makes the most sense to them. 23 00:01:31,307 --> 00:01:37,452 But you can also do it yourself and then test it with users afterward too. 24 00:01:37,452 --> 00:01:39,393 Let's get to organizing. 25 00:01:39,393 --> 00:01:42,324 The first group I am seeing is an about group, 26 00:01:42,324 --> 00:01:46,120 where users would find out information about the school. 27 00:01:50,017 --> 00:01:52,971 I'm grouping the mission statement, 28 00:01:55,474 --> 00:01:59,842 Staff list, News, 29 00:02:03,771 --> 00:02:11,900 Contact information, And directions to this group. 30 00:02:19,551 --> 00:02:22,921 The second group I'm going to call families. 31 00:02:22,921 --> 00:02:26,712 This is the information parents and guardians will want to access 32 00:02:38,032 --> 00:02:40,877 Here, I placed the school calendar, 33 00:02:43,303 --> 00:02:48,223 Lunch schedule, Lunch fees, 34 00:02:50,570 --> 00:02:57,673 Volunteering, PTA, the Parent Teacher Association, 35 00:03:00,635 --> 00:03:05,540 Donations, And the student handbook. 36 00:03:08,582 --> 00:03:11,091 The third group is the academics group. 37 00:03:11,091 --> 00:03:14,737 Programs vary from school to school, so 38 00:03:14,737 --> 00:03:20,313 I just grouped an item called programs here as a place holder, 39 00:03:20,313 --> 00:03:23,543 and I also added photos and videos. 40 00:03:23,543 --> 00:03:27,633 I think users would like to see the programs and not just read about them. 41 00:03:27,633 --> 00:03:32,865 The final group is called activities. 42 00:03:32,865 --> 00:03:37,012 I added sports and clubs here, and 43 00:03:37,012 --> 00:03:41,593 I also added photos and videos again. 44 00:03:41,593 --> 00:03:46,499 Seeing all the different activities available would be great for adults and 45 00:03:46,499 --> 00:03:47,731 for the students. 46 00:03:47,731 --> 00:03:51,002 Let's put these together into a sitemap. 47 00:03:51,002 --> 00:03:53,800 And here's the final diagram. 48 00:03:53,800 --> 00:03:58,702 Having the layout for the overall site now lets me focus on designing 49 00:03:58,702 --> 00:04:01,632 individual pages and common features. 50 00:04:01,632 --> 00:04:03,795 This will also help the team or 51 00:04:03,795 --> 00:04:07,612 client better understand the scope of the project. 52 00:04:07,612 --> 00:04:09,200 Nice job designers.