Initial Design Ideas for an Interactive Website Project

EDCOM Website Design


For this project the intended audience is 11-16 year olds studying ICT in school.  The site will give an elementary view of the internal features of a desktop computer.  The site will contain links to other sites and sites which extend the concepts of computing architecture.  The current curriculum does not require pupils to understand how the devices within a computer communicate,  therefore the technical level of the website does not have to get to involved.  But appopriate links sould be made available for those who want to extend their knowledge.

If at all possible the use of interactive content would be an advantage.


The purpose of this site is to give an understanding of the internal components of a desktop computer and to teach students what each part does and its relevance. The detail will be sufficient to give students the ability to recognise the various parts and to explain how the device connects within the computer.

A diagram of the process used within a CPU will lead to an understanding of the various controllers used to convert a binary numbers in to an action carried out as an instruction within the computer.

The Images

Copyright will not be required for the images used in this site as they will be photos from the author’s library. The images in the story board have been created within Microsoft Visio. Initially they were hand drawn on squared paper (see appendices) and then adapted for this document and the design process.

The text

Where relevant, blocks of text will be referenced so that proper attribution is included within the website.


Image Details
Basic page structure using php includes. This allows a consistent layout within the website and faster page loads.A combination of Div’s and Sections will be used to allow rapid navigation within single pages of the site.
It is important to use clear text and either Verdana or Ariel will be used throughout the site.Plain low glare backgrounds are preferred. However splashes of colour will be used to highlight certain features of the site, such as buttons.
Where possible large images will be used for clarity.Static menu navigation will be used to allow the user to move round sections of the website without changing pages.
Image Details
Various images will be used with the addition of sprites to pop out as the user moves over the image.
A random quick quiz will be deployed to allow the user to revise prior to the section named exam.When the submit button is pressed the answer will apper in a section below the question so that the user receives instant feedback to assist with the learning.
Through the use of an iFrame a Google Doc questionnaire will form the basis of the exam.This will contain a link at the end for the user to view their results, which will be displayed in a Google Spread sheet.
Image Details
A glossary will be used to give information about each part of a computer.This should have a static menu across the top with the alphabet so that quick navigation can be made to a particular topic.

Kind of Digital | What is… guides

Posted from Diigo. The rest of my favorite links are here.

How to add Diigo Bookmarks to your Blog from Diigo

I have discovered how to add the bookmarks I create in Diigo to my blog at long last and thought I would share it with you.

  • First off you should install the Diigo Toolbar into whichever browser your prefer.
  • Once that’s done have a search around for content you may want to add to your Diigo Library
  • Use the Bookmark toolbar by clicking on Bookmark at this point you can add a tag – ie: UoP_EDCOM

  • Enter all the details you want especially a description then press the Save button
  • Navigate along your Diigo toolbar to the Send button

  • Select “to Blog
  • This will open up a new entry screen over your current window
Blogging submission form
Blogging submission form
  •  You need to add your blog information on the left.  I have mine there but see the image below for general advice
adding a new blog to Diigo
adding a new blog to Diigo
  •  Fill in the details of your blog.  I copied  the URL from my browser and then Pasted it in the box, click on Next.  It will ask for your Username and Password, just enter them and press save.
  • Now your Blog should be in the list on the left.
  • Using this screen enter a message to your blog followers so they understand why you felt this site was worth bookmarking and sharing.

adding your message so followers of your blog know why you bookmarked the page

  • Once you have added your message place a tick in the box next to the name of your Blog
  • adding a tick to the boxSelect the place within your blog where you want to display your feed.  I chose my PLN.

That’s all there is to it.  Now press Send.  Your done and you can see the fruits of your labour by reviewing your Blog.

Page level permissions on Google Sites

  • Page level permissions to hide the results sheet for a google sites quiz. I haven’t tested it yet but will do. Check my PLN for the feedback.

        Ideas for a quiz educator type site

  • Create your Google Site

  • Build your Google Docs Form for the quiz/survey

  • Insert the quiz/survey on a page within the site

  • Create a second site to host the spreadsheet with the answers and results

  • Supply a link at the end of the quiz/survey for the user to view the results

          tags: googledocs education UoP_EDCOM

          Posted from Diigo. The rest of my favorite links are here.

An interesting piece on gender affects to learning styles

I found this web resource Learning Styles and Gender which discusses an academic study of the boy girl effect in classrooms.  I found it really interesting and did a search for the paper it relates to on Google Scholar.  Referring to the conclusion in the paper (HTML version) “contributions from boys predominate during classroom interaction” (Howe C, 1997) I can confirm this to be true.  Well at least in my experience of University Seminars and Tutorials.

Here is a copy of the research paper that you can download Gender and Classroom Interaction.

A really handy resource for writing

I know it’s not the most exciting subject but writing is a really big part of being a student.  It is therefore really great when you manage to find such a wealth of knowledge under one umbrella.

Portsmouth University has a really good source of support for academic writing and other skills need by students to get through their course.  ASK offers really good advice for students covering a lot of disciplines, such as referencing.  Now perhaps I should be biggin up Portsmouth University and their staff  and support mechanisms; I have in the past and most likely will do again.  But I have found another truly brilliant resource for academic writing support.

Purdue University in the United States has a brilliant site called OWL Online Writing Lab.  I have used this website on a number of occasions.  The material here is really easy to understand with useful step by step instructions for some of the tasks you might need to complete when writing.  Many of the modules used here have superb examples of writing techniques, which I have found to be really worthwhile.

Learning Styles-the test and results

This week in our Educational Computing tutorial we were asked to complete some learning style evaluation tests.  Below is an image of the results page to one of the tests I took, you can try it here Learning Styles Survey.

Image of OU learning styles test for Tony Crowther
My results from the OU Learning Styles Survey


This prompted me to discover what was meant by Metacognitive.  I mentioned it to Sam one of my class mates and he looked it up quickly on Google.  His reply was “knowing about knowing”.  Ok this helped a little but I want to know more.  So I do a search on Google myself.  After a short wait the usual suspects appear with an answer (Wikipedia – the fountain of all knowledge).  After a deeper scan of the search results I locate something I feel I can trust from the Purdue University.  “Metacognition refers to learners’ automatic awareness of their own knowledge and their ability to understand, control, and manipulate their own cognitive processes Follow this link to read more Metacognitive.

So what exactly is it saying about me?  I tend to know how to learn and what it takes to get the job done, it also means I can be self-critical and need to check my results fully and make sure that A + B does in fact equal C before accepting it as fact.  Suppose it might sound like I am a little picky at times.  Oh no hope it’s not OCD!!


Give Zotero a try

After today’s EDCOM tutorial I have decided to give Zotero a try.  Using my Portable Apps version of Firefox I downloaded the plugin for Firefox and created my user ID.  I have had a quick tour of the interface and it seems like it maybe useful.  Certainly cheaper than having to pay for Endnote to get full functionality.  I also like the fact that I will take care of most of what Diigo can do in terms of bookmarks.  I have yet to test the cite feature but in the meantime I have downloaded Zotero to my desktop version of Firefox which I proxy via the University of Portsmouth.  The test captures I worked on in the tutorial have crossed over nicely to my desktop version so I can be confident that the sync feature is working, otherwise whats the point.

I really like the fact that it is free!!

I will continue to trial the application and report back soon.