Lesson Preparation using the New Google Sites

I have made a start on my planning for Jump Start and next year, so I decided to bite the bullet and use the new Google Sites to do it.

I have decided to do a seperate site for each Year group then link them all together using a hub page site.
The one I have been working on the most to start with is the NCEA Level 1 site as this will be needed for Jump Start in week 5.

I have only got one project on here at the moment, the Architect Poster project, and areas for skills and literacy. If you look at this as i write this post, there are gaps as it definitely a work in progress.
Link to site

There are drop downs under each label, so lot of information is included on the site.
Under the home page is the Level 1 calendar and the standards that are on offer over the year.

Under the project tab, there are all the activities listed that the students have to complete for that project. Each activity has it's own page.

Under the skills tab, there are some skills that will be needed for this project. This will be added to over the year as the skills that they need increase.

Under the Literacy tab at the moment, are the activities that we are going to do over the Jump Start period of time at the end of the year. This area will be added to as well as the students need more literacy skills over the course.

Please take a look and any feedback on layout, design or content will be greatly appreciated.

New Google Sites

When the new Google sites came out, I had a little go and instantly hated it.
I mean, come on. I'm a Graphics teacher. I need to change fonts!!!

Anyway, as more staff at school are starting to make sites using the new sites, I have decided to force myself to love it as i am going to end up supporting people with something I haven't played with properly.

I decided to make my experimenting useful and so I have started off by making a Junior site. This will be used by Year 7, 8, 9 and 10.
I soon realised that the navigation across the top was not going to allow me to have one site for everything that I have at the moment on the old sites layout. Link here to my current site.

My layout decision was to make one site that has one page on it, illustrated above. This will have links to seperate sites for each level / link, with them all having the same look so you don't feel like you are swapping between sites all the time. I still want it to feel like one overall site for everything like I have now.
So far I have made and started on a skills site and a juniors site.

Link to hub front page
Link to juniors site
Link to skills site

What I don't like?
It's a really long list so lets focus on the positive....

What I like?
The look is clean and simple
It is REALLY easy to add stuff and use
How it flows beautifully for different sized screens and viewing

I am sure the like list will grow as I use it more and Google add functionality to it.
I shall continue to force myself to love it.

Using site Templates for Design Porfolios

I have been using Google Sites with my students as their their design portfolios for a few years now. The first thing we do at the start of a new year is make our sites and go over the Google skills they need like embedding docs and images onto their site, making new pages for each project etc. As the time goes on that we have been working online, the students are needing less and less google "skills" time, as they know what they are doing better than I do.

Where I continue to struggle each year is keeping up with getting the work up onto their sites. We always seem to be doing it at the end of projects, in a mad rush, instead of it being a gradual process over the course of a project.
I was talking about this with my HOD and she was agreeing with me and explaining what she was thinking about for next year, which was making a site template for her students, with areas for each task that they have to complete, so the students know what to put on the site and in what order. I am always keen to steal / borrow / use good ideas so I immediately jumped on this one. This came about at this time as we were discussing the order of work on the student sites needing to show the flow through the project. We were going through Level 1 moderation at the time, so the random order that some students had presented their work was a talking point.

What I have come up with over the last couple of days is this template design.
It includes tabs for all the projects they will do over the year and on each page, there are headings for all the tasks that need to be completed within each project.
Link to the template

There are 2 planner / calendar items on the home page.

The year plan is so they can see an overview of the year at a glance.

The embedded calendar is for another experiment next year. Again, the idea came from my HOD. She puts links to the tasks she wants the students to do that day on the class calendar using a href attribute in the calendar notes.

<a href="http://www.w3schools.com">Visit W3Schools</a>

I thought this was a great idea this year, but resisted trying it as we never seem to be where the calendar says we should be in the project. So the plan is to only put lesson task links in the calendar a week in advance. This means that the usual year layout will look out of place in the calendar if it is not matching the lesson notes. This was the reason I have separated the year overview into a snapshot.

I have also included a link to the Level 1 Google Plus community on the front page so they can find it easily and there is a link to the class site. Links to my site / project examples are on each page too. 

All these help links can be removed before the sites are sent away to Wellington in November to be looked at for external assessment.

I considered putting in the blank worksheets / docs in place on the pages but decided not to as the students like to do things in different ways and I don't want them to feel like they have to do it the same way as me.

It is a balance between trying to save them time and being helpful, and doing too much and being controlling. 

Time to wind in my inner control freak....

Site Design - Template 8

This design has the page set up so that the layout is "left sidebar". Both the horizontal and the sidebar navigation is turned off.
A tall, slim Google Drawing is embedded on the left sidebar with the links to the group pages set up on the drawing. These links lead to site pages for each group.
The header was made on a drawing and downloaded as an image file so that it could be used in the header on the site.
The main, large area of the page on the home page is used by an embedded Google Map that shows the areas of the school that each group is in charge of keeping tidy.
Using the left sidebar option to put the navigation drawing in leaves the rest of the page available for content on the front page, as the whole thing is not taken up by navigation as in other examples in the series.

Link to the template here
Link to the files used on the template here
See the rest of the templates in the series here

Site Design - Template 7

This layout has the header still in place but all the navigation is turned off.

The image for the header was made in Google Draw, with the background of it left transparent and the writing white. When downloading, the png option was chosen as this keeps the transparency. 

The background colour of both the site and the page was chosen to be the same in themes, colours and fonts, so an even colour is behind everything.

The main image is an embedded Google Drawing so the links on each option work. The background for this embedded drawing is transparent so when it is put into the site the colour of the site shows through.

Link to the template here

Link to the files used on the template here

Link to the other template designs in the series here

There is a How To about making shapes into links on Google Drawing here

Site Design - Template 6

This template design continues the theme of using a Google Drawing for the navigation. The front / home page is an embedded Google Drawing. I have removed the site title / header and both navigation bars so this is all reliant on the Google Drawing.
Each of the coloured bars acts as a link to a page on the site. This had to be done on the drawing itself, so the links could be placed on the coloured shapes. I made the pages on the site and took each page url to be the link on the drawing.
The coloured bars theme is continued on each page with the headers...
The titles of each page have been removed on the page settings so these title bars are right at the top of each page and match with the coloured theme.
I have not put a home button on the individual pages as they open in different windows when clicked on the main page, so the home page is left open.

Here is the link to the template.
Here is the link to the file of documents used on the design.
Here are the rest of the site templates in the series.
There is a How To about making shapes into links on Google Drawing here

(If you use the Google Drawing from the design, the design includes a white circle to make part of the curved shape on the front. When it is embedded, only the part that overlaps the page on the drawing is included.)

Site Design - Template 5

The main focus of this template is the embedded Google Drawing. This drawing has a picture on it that has areas made into hyper-links to websites. When you click on the individual areas (planets, in this case), you are taken to different websites.
All the navigation has been removed and the main elements are the 5 round buttons at the top. These could take you to documents with the work for individual tasks or they could take you to more pages on the same website. ( the example buttons here are not linked to anything ).
I have laid out these 5 buttons in a single row table that has 5 columns in it.
As I had made the site 1000px wide, I made each of the 5 columns on the table 200px. The colour of the border of the table was changed to white, so it is invisible against the white background, by changing the rgb colour number to 255,255,255.

I then made sure the button images that I placed in each of the table cells were set to 100%, as this means they fill 100% of the space they are given... ie the 200px you gave to the cell width.

All of the images were created on Google Drawings. The header and the buttons were downloaded from drawings as png files and uploaded to the site. The main image with the planets on it was embedded as a Google Drawing so the hyper links will work.

Here is the link to the site template

Here is the link to the files used on this design.

Click here to see the other site design template in the series.

There is a How To about how to make the clickable links on a Google Drawing here.

Site Design - Template 4

This is site design number 4.
The header is still on this design and is made on a Google Drawing. This was downloaded as an image file and put onto the site in the themes, colours and fonts section of mange site.
The horizontal navigation is on and it is set to links. The colour of the links have been changed to match the header. This was done in themes, colours and fonts on the manage site option.
The layout of the page is the choice with the left side bar, so this is where the round group buttons were put. These buttons were made on Google Drawing and downloaded as image files.

Link to the site template.
Link to the documents folder for this site.
See the rest of the template design series here.

Site Design - Template 3

This is the third template design of the series.

I have made a single page site. It has no navigation either on the side bar or the horizontal bar.

The header has also been removed to make the site simple.

The main focus of this design is for groups of teachers in the same hub / team / department to have a single place to put links to their individual class sites.

The main buttons are designed to have a picture of the teacher and the name and classroom on them.

The logo could be the school logo.

All the buttons on this example are linked to external sites. You could link them to pages on the same site or to separate sites made by the individual teachers.

Link to the site template here...

Link to the files used on the site here ...
See the rest of the template design series here ...

Site Design - Template 2

This is the second site design template.
I looked at how to collect pages together for different groups. I used the "treehouse" template to get the overall look of the site. The sidebar was kept switched on and I have not used a horizontal navigation bar.
I put two different navigation areas in the sidebar and chose which pages to include in each group.
The group 1 and group 2 titles were made on Google Drawings and saved as image files. These were included in the sidebar in text boxes.
This is quite a simple set up, but I wanted to focus on grouping elements together in the sidebar.
To simplify the look more, I removed the search box that automatically appears in the header and centred the main title.

Link to the site template here.
Link to the documents used on the site here.
If you want to find out how to make the slider on the front page, the link is here.
Check out other site design templates on this link here.

Site Design - Template 1

I had a really interesting conversation as we were having our after school toolkit sessions yesterday. We were working on our site designs, and I was chatting with a colleague from a local primary school and she was wanting a site design that did not use tabs across the top or a side bar as it was too fiddly for her very young class. She just wanted button navigation for them on the class site.
This got me thinking about site design a subject. There are so many different ways of doing a class site using Google sites. It is just a case of thinking about your user and how they are going to be using the site and tailoring it to fit.
So this in turn got me thinking about doing a series of different design templates.

Here is the first one that I have tried.
I have taken all the navigation off ( no side bar or horizontal navigation tabs ). I have also removed the header so that custom headers can be placed on each page.
I have made this site a template if you want to use it, just click the bar at the top. When you have your own copy, you can get into the settings and see how it is made and laid out. The link for the folder of documents is down below.
I made page 1, linked off button one on the home page, then I made that a page template so that I didn't have to worry about sizing the Google drawing at the top every time I made a new page. All I have to do to make a new page is to choose the page template and change the link to a different google drawing ( if i want a different one at the top ).
All of the buttons are made on Google Drawing and either embedded as a drawing (in the case of the page headers, so the moving gifs work) or saved out as images and the images linked as buttons.
Here is the link to the folder of documents if you want to use them.