Welcome and orientation

Image by Danere. CC BY-SA 4.0.

Welcome! This page is an orientation to the coding side of both of Birkbeck’s postgraduate modules in digital media design.

• Web Development and User Experience
• Visual Design and Web Project

The coding sessions in these modules are designed with a single through-line.

Link to this website

birkbeck2.github.io

Purpose of coding sessions

You will learn practical coding skills, develop your creative practice, and form critical perspectives on the issues that commonly face web development projects.

Creative

Practical

Critical

Example: Someone wants you to make a webpage that has a bookshelf, where each book is a link to a different page.

• You create a custom-tailored CSS layout
• You know practically which CSS properties to write in the stylesheet
• You raise critical questions about usability: how will the bookshelf layout work on narrow screens like mobile phones?

Finding the right balance of these three will be our constant aim.

Timeline of topics

Here are the development topics to be covered this year.

Autumn

Topic	Lecturer
Getting started with coding	Joe
Semantic and presentational HTML	Joe
Intro to CSS	Helena
Responsive CSS and flexbox	Helena
Accessibility in HTML and CSS	Joe
Grids and other CSS concepts	Helena
Advanced work with images	Helena
CSS topic TBC	Joe
Student website workshop	Helena, Joe

Spring

Topic	Lecturer
Intro to JavaScript	Joe
Conditions and functions	Helena
Objects and loops	Joe
The Document Object Model	Joe
Interaction and events	Joe
Visualising data	Helena
Animating data	Helena
Crit	Helena, Joe, Inês

Session format

Preparation

There is too much material to cover through lecturing, and we know that students learn best if you have ample time in class to practice, experiment, get help and feedback, and discuss each other’s work.

So, preparation is essential.

We usually ask you to watch coding videos, and we often also ask you to read academic articles or textbook chapters.

• Coding videos - essential viewing so you can begin absorbing programming concepts and technical syntax and patterns before you get to class

• Academic articles - perfect material to deepen your critical thinking

• Textbook chapters - more systematic and thorough coverage of the same ground as the coding videos

Live coding

We usually begin each session by showing you coding examples and answering questions about things that you are confused by or stuck on.

It is basically a warm-up for the workshop, and a chance to refresh your memory of the assigned videos and chapters.

Workshops

This is the main event of the session, where you can put things into practice and experiment. Each workshop is different, but we try to provide step-by-step guide for the practical bit, and more open-ended prompts for creative and critical work.

Often the workshop will ask you to share a link to your work with everyone, and we try to include peer review as often as possible.

The practical part of the workshop is often “required” as homework (see Homeworks).

Show and tell

We end most sessions with an open call for you to share something you made. All you have to do is put your code on the projector screen, talk us through it briefly, run it, and take questions.

You are welcome to show works in progress, and you’re encouraged to talk about things you found difficult or problems you have not yet solved, so that you can get ideas for possible solutions.

Homeworks

At the coding sessions, we usually assign homeworks to be completed within five days of the session. The homework is typically just a piece of what you made in the workshop, so if you are well-prepared and focused, it is possible to finish your homework during the session.

The purpose is simply to make sure you are making steady progress building your coding skills, and that you have low-stakes opportunities for instructor feedback.

Homeworks form a very small part of your assessment--one percent each--and are marked either as full credit or no credit.

Five homeworks are required if you want full credit. But you will have at least six opportunities to submit a homework, so you can miss one and still get the full five percent.

Resources and tools

Moodle

Birkbeck’s Moodle is the starting place for these modules and serves as the source of truth, if in doubt about something like a link, due date, or pre-sessional activities.

There is also a discussion forum set up inside the Moodle course for asynchronous sharing, feedback, peer review, discussion, and coding help.

Web Development (this website)

Lecture materials are generally published and stored on this website. It is public so that it is easier to access and reference regardless of your enrollment.

We also store some helpful information that is unlikely to change here (like the page you’re reading), since it is often more accessible and flexible than Moodle.

GitHub

GitHub is where you store, share, publish, and submit code projects in these modules.

Repositories

Repositories are the main way code is organized and shared. They usually have version-control built in via a tool called Git.

• Web Development is the main content repository where we keep lecture materials, workshop instructions, and code sandboxes and examples.

• Your repositories will also be stored here, usually associated with the Birkbeck organization called “Birkbeck2”. To create Birkbeck-affiliated repositories, follow the relevant links on Moodle.

GitHub Pages

GitHub Pages is a feature of GitHub that lets you publish the code in a repository as a website. A URL is generated for each website. You can make the website public or keep it private.

Computers

You can complete the coding assignments on Birkbeck computers, but a personal laptop is encouraged if you have reliable access to one.

It is a good idea to have the same computer for a whole project. As your projects grow more complex, it can become difficult to switch between computers, because you have to install and configure several tools for version control, code editing, and scripting.

Main assessments

The main assessments are both websites that you create over the course of the term.

• Autumn - a fictional presentational website built with HTML and CSS, along with an essay that critically articulates your development choices

• Spring - a dynamic and/or interactive web project built with HTML, CSS, and JavaScript, using your chosen visual language, with a critical report

Detailed assessment descriptions can be found on Moodle.

Generative AI policy

From Birkbeck’s policy: “You must not submit work for assessment that has been generated by a chatbot or AI tool. Without [the authorisation of the module convenor], your use of generative AI is likely to be treated as academic misconduct, as with any other form of contract cheating or plagiarism because the words and ideas generated are not your own.”

From the WDUX module convenor on Moodle: “Any use of generative AI tools to help write essays or code will be flagged as an assessment offence.”

If you use AI to generate code for an assessment, this is what will happen:

1. Instructors will notice, because we keep a close eye on your coding style, your participation in class, and telltale signs of AI-generated code.
2. We will schedule a viva voce examination where you will be asked to describe how you wrote your code, and explain how it works. Usually, when students have used AI to do something they do not know how to do, they are unable to pass this exam.
3. If you do not pass the viva voce exam, the case will go to a series of academic misconduct panels, which could result in anything ranging from a formal warning to termination of enrolment.

The only exception to this policy is if a student has a legitimate use as part of their Study Support Plan with the college’s accessibility office.

Any changes to this policy for the VDWP module will be communicated in January.