Teach Writing with a Web Design Project

image source: John Allan

One of my courses specifies that students create a presentation on an educational resource and present it to their peers.  The following is a model I’d like to share with you as a potential means of using a common theme with a final presentation as a way of promoting inquiry, research, collaboration, communication, planning, and writing within one term of instruction. The project comprises eight separate activities.  Each activity involves the students practicing language and social skills in a variety of ways.  These steps are detailed below in the section, Project Process.

Priming the students

To introduce the project, a finished mobile website is shown to the students. As well, each of the project process steps are presented to the students. The instructor also provides the students with an overview of educational resources in different formats.  In our case a college tour, a college “QR-code treasure hunt”, viewing web resources and elicited discussion about educational resources through their personal experiences. (See my previous blog for more on the QR code treasure hunt.)

The project topics included:

  1. Library services
  2. Learning Commons
  3. Recreation
  4. Student Life
  5. Individual Academic departments (example: Health Sciences or Engineering)
  6. Information Technology Support
  7. Student Counselling
  8. MOOCS/ off campus Online resources
  9. Public Library system

Project Process

  1. Students pair off and agree on a topic.
  2. Students write a project proposal focusing on the education resource. In this proposal they must identify their topic, provide three main categories and how they as students benefit from this resource.
  3. Students create a draft project plan. The project plan, a table with at least fifteen particular steps, specifies the task, responsible team member and expected due dates.
  4. After the instructor reviews the draft project plan, the students revise their project plan and add ten more tasks to the number of tasks. Students submit this as their final project plan.
  5. Students are introduced to the concept of a storyboard. Most of them are familiar with the concept.  They are charged with including a title and a very short description of the contents of each page including image, video, text.  If an image or video is included, a citation is required on the storyboard.
  6. Students are required to submit a complete document containing all website text similar to the storyboard sequence of pages. This ensures that their text is summarized from sources and is not plagiarized.
  7. Finally, students submit their final project in website format for grading. They provide a web address.  The instructor opens the site and uses a rubric to assess this project.
  8. The group presentation is the final activity of this project. A cable links a student mobile device to the class projector.  Students tap, swipe and drag with their fingers during the presentation while they are speaking about the topic.  It was a new experience for all.

WinkSite (Mobile site builder) Familiarization

WinkSite is a mobile website generation tool.  The basic account is free.

Our students worked through a step by step creating a mobile website activity to give them confidence that the technical side of the project is not going to be difficult.   This 30-minute activity guides students to create a mobile website based on a template for the city of Niagara Falls.  At the end, students are amazed that their mobile site has a professional layout, colour scheme, fonts, images, embedded video, contemporary menus and is responsive to all device types.  That is, it has a professional appearance on tablets and phones.

Final thoughts

As language learners, the students spend most of the time either communicating, researching, cooperating, writing, summarizing and/or citing media.  The majority of effort occurs before students start editing with WinkSite.  If they follow the steps above, they will have all of their images, video links, text and pages organized in a digital folder and on a Word document before they start editing with WinkSite.  All assembled media can easily be copied or uploaded into the WinkSite forms. WinkSite does all of the layout and coding.   It is a lot of facilitation and record keeping, but the results are worth it.


Step-by-step Winksite familiarization activity, https://bit.ly/2I9B5o2

Winksite, https://winksite.com

Winksite activity site example, http://winksite.com/mrpottz/niagarafalls

Hi—I'm John Allan. I am an educator who works in the technology enhanced language learning field. I create online learning opportunities and mentor instructors on the Avenue project. I have experience teaching ESL and EFL in Canada and the Middle East. I hold an MSC in Computer Assisted Language learning, a M.Ed. in Distance Education, TESL B. Ed., a B.Ed. (OCT), and a variety of TESL relevant certifications from TESL Canada, TESL Ontario and the Ontario Ministry of Education. For more articles, learning objects, projects and blog links see https://www.linkedin.com/in/johnharoldallan


2 thoughts on “Teach Writing with a Web Design Project”

Leave a Reply

Your email address will not be published. Required fields are marked *