Submissions will be reviewed and assessed based on your overall response to tasks and briefs, completeness, organisation, reflection, technical and aesthetic application, execution and quality.

Generative design fundamentally changes the design process: the designer shifts from being a performer of tasks to being a conductor, effectively orchestrating the decision-making process of the computer. This is what generative design is all about: iteratively developing different processes and then selecting those that produce the most visually compelling results.

From using code as a means to generate static, moving or interactive images, to communities, industries and futures that embrace algorithmically generated content, building digital experiences to new adventures into artificial intelligence and neural networks, generative design finds many applications ranging from artistic expressions, branding, architecture, interaction design and other forms of creative applications.

The term "making" refers to the process of producing artefacts, products or tools using craft or technology-based techniques like for example digital fabrication. The spectrum here can range from the novice learning a craft to the master craftsman masterfully applying a craft and passing on their knowledge. Often, more attention is paid to the process of making, sharing, collaboration, and techniques than to the end result.

Think of making as a trade and a culture. Making here can also refer to "The maker culture which  is a contemporary subculture representing a technology-based extension of DIY culture that intersects with hardware-oriented parts of hacker culture and revels in the creation of new devices as well as tinkering with existing ones. The maker culture in general supports open-source hardware."

Physical Computing can be applied to applications where computers interact with the physical world and vice versa. The Internet of Things, robotics or physical interfaces are common applications. Physical computing refers to the use of tangible, embedded microcontroller-based interactive systems that can sense the world around them and control outputs such as lights, displays and motors.

Although this might seem rather technical in approach and application, it provides a an environment to better comprehend playfully and eventually build a connection between physical objects, computer hardware and software applicable not only to technical practices such as engineering or computer science but equally important to creative practices like art and design.

Explore

Ideate

Make

Test

Share

We will meet on a weekly basis every Wednesday at 9.30am in F301 or D501 based on your assigned workshop for that week. For a breakdown of the weekly schedule, navigate downwards.

Intro

Introduction to classes and weekly sessions. Warmup activity.

1st Workshop Session 1

Introduction and getting started with respective workshop per class.

1st Workshop Session 2

Exercises continue and conclude at the end of the session.

2nd Workshop Session 1

Introduction and getting started with respective workshop per class.

2nd Workshop Session 2

Exercises continue and conclude at the end of the session.

No class

Project Week, independent study.

Web 101 Session 1

Introduction to website template.

Session 2 continues in Week 9

No class

Lunar New Year.

3rd Workshop Session 2

Exercises continue and conclude at the end of the session.

Web 101 Session 2

Continue on website template.

3rd Workshop Session 2

Exercises continue and conclude at the end of the session.

3rd Workshop Session 1

Introduction and getting started with respective workshop per class.

Work check

Checking on CPJ, summary microsite.

Wrapping up

Submission briefing, working on documentation, populating summary microsite with content.

No class

Independent study.

No class

Assessment.

The process, the object, the action should always be in the foreground and in focus when documenting your work so that it can be easily identified as the protagonist, the main character of the image or video that one is looking at.

Don't take a picture or video of your work just for the sake of taking a picture or video. Think about your audience and how they will perceive the image or video you have prepared for them. Provide them with the best and highest quality experience possible so that your audience sees that you care about your work and them.

Pay attention to the lighting conditions of the environment in which the work is being documented. Add additional light as needed, but make sure the entire scenario is properly lit for optimal viewing on a screen or in a printed publication.

Pay attention to the environment in which you are filming or photographing. Is the background very distracting, maybe clean it up or change the scene? Are there any unnecessary objects lying around? Are the surfaces clean, no coffee stains? Make sure to present your subject the best possible way.

Same procedure as last year. The Digital Portfolio is a digital archive which you will use to document your work based on activities and exercises conducted in class. A given folder structure tells you which documents are required. You should update your Digital Portfolio regularly.

Download Digital Portfolio from Google Drive

Familiarise yourself with the Digital Portfolio Guidelines

In this class, we will introduce ChatGPT as a learning-to-code assistant. It will help students understand and solve basic technical concepts and problems, both in groups and individually. ChatGPT excels at explaining technical concepts and providing coding examples.

The suggested code snippets from ChatGPT can then be further modified, extended, sculpted by students to achieve an (un)expected outcome based on briefs given. It is the playfulness and the experience we wish to expose students to in order to better learn, understand and apply tech as part of their own practice.

ChatGPT works with algorithms and is trained to generate human-like text that can be used in conversation. It can answer questions, provide information, and engage in natural language discussions with users.

Some potential use cases for ChatGPT include customer service chatbots, virtual assistants, and conversational interfaces for websites or mobile apps. It can also be used to generate content for social media or create chatbot scripts for marketing or entertainment purposes.

Overall, ChatGPT is a powerful tool for creating chatbots that can have intelligent and engaging conversations with users.

Generative AI

AI models that can generate open-ended content, often creative content like visuals, music or text.

LLMs

Large Language Models, are advanced computer programs designed to understand and generate human-like text.  

Prompting

AI chat prompting is a technique where a computer program provides suggested text or other outputs to help users engage in natural language conversations with AI or to generate creative outcomes like visuals for example.

Hallucination

AI hallucination refers to a situation where an AI system generates content that is not accurate or based on real information, often creating fictional or misleading outputs.

Bias

Bias in AI refers to the presence of unfair or skewed representations and decisions made by artificial intelligence systems, potentially leading to unequal treatment or inaccurate conclusions.

What is this about?

How does that work? How do generative language models work?

Predicts words based on previous text given and the data the model has been trained on.

To us this looks like magic, to the computer it is a gigantic pile of data that an algorithm ploughs through.

How does this work in the browser at chat.openai.com?

ChatGPT provides a free version which you can sign up for at chat.openai.com. You can then use ChatGPT in the browser but also on your phone.

What are some of the opportunities that ChatGPT provides us with?

We can use ChatGPT as a coding assistant for this class. This does not mean that ChatGPT will do all the work for you, but it will be able to support you in completing the exercises and assignments we give you.

Still, this class is about design and giving form to ideas through code.

What should you be mindful of?

ChatGPT can be a very powerful tool and it will, already is, embedded in many applications that we use on a daily basis, hence, it is important that we, you, are able to use this tool. However, we should not blindly trust the technology and we must be mindful and considerate in the content that we prompt and produce. You need to be responsible.

Prompting tips

Study with ChatGPT, ask questions that you want to ask your teacher or google

Summarise concepts for you, for example coding concepts like loops: Can you explain to me the coding concept of loops, I am using p5js and it would be great if you could explain it to a newbie student? or Can you explain to me the coding concept of loops, I am using p5js and it would be great if you could explain it to a child?

Explain it to a child

Ask for example code that specifically addresses a concept like shapes: can you give me some p5js code that demonstrates the beginShape vertex and endShape commands?

Ask  ChatGPT to break down a response into steps: I want to create a p5js sketch with 5 different shapes at random locations and with different colors. Can you break down the steps for me to take? I am using the p5js online editor.

You are free to use generative AI tools like ChatGPT in any way that helps you in your learning for this class. However, any usage of generative AI must be properly acknowledged.

At the very least, you need to provide a statement of use that clarifies what, if any, technologies you employed to create content while working on your assignment.

Remember that you are in school to learn and become an independent learner and eventually an expert in your field of study and practice.

Generative AI tools can help you achieve your ideas, visions, futures, but keep in mind that the quality of your work is determined by talent, practice and knowledge.

Playing with Machine Learning and Computer Vision. We may have heard so much about it, let's try it out.

This is a group activity, team up in groups of 3.

Playing with Machine Learning and Computer Vision. We may have heard so much about it, let's try it out.

This is a group activity, team up in groups of 3, then select one of the demos to play with

An intro to Machine Learning for Designers

ml5, friendly Open Source Machine Learning Library for the web

Nervous about what you dont know? Grab your friends and plan a workshop

The work of Andreas Refsgaard + Playful Machine Learning video

Fei-Fei Li: If we want Machines to think, we need to teach them to see

Teachable Machines

In this workshop we will look at Creative Coding and Generative Design in particular. We have touched on some basic coding principles during Semester 1 and this exercise can be seen as a continuation and extension of what has been covered and practiced.

Here we will take a closer look at how code and simple 2D graphics can be used to create a series of generative imagery which can be static, dynamic or interactive.

Much of the built environment around us has begun incorporating more and more generative design principles within it. Be it the layout of a building, or its decorative facade, generative design is hiding in plain sight within our city.

Computational aesthetics has ceased to be something that is merely trapped within our digital devices and is now a significant part of our everyday reality – if we choose to see it.

In this workshop, you will attempt to understand an existing algorithmic building facade's design and breakdown its logic into code, producing a series of generative grid-based patterns based on your visual research.

This project will require you to produce two sets of outcomes.

images

video

docx

Code To Thing is an exercise that looks at how code can be turned into a physical object. You will explore 3D space in code and create 3D objects from a given code template. You will then use 3D software to convert the 3D objects generated from the code into printable templates that you can handcraft into a physical 3D object.

Furthermore, you will need to focus on proper documentation techniques and styles to create content of the 3D objects and design a folded A3 poster. Through these processes, you will be able to gain an understanding of working with digital and physical tools, as well as the workflow from digital to physical.

The term "making" refers to the process of producing artefacts, products or tools using craft or technology-based techniques like for example digital fabrication. The spectrum here can range from the novice learning a craft to the master craftsman masterfully applying a craft and passing on their knowledge. Often, more attention is paid to the process of making, sharing, collaboration, and techniques than to the end result.

Think of making as a trade and a culture. Making here can also refer to "The maker culture which  is a contemporary subculture representing a technology-based extension of DIY culture that intersects with hardware-oriented parts of hacker culture and revels in the creation of new devices as well as tinkering with existing ones. The maker culture in general supports open-source hardware."

Link to external Slides

This physical computing exercise aims to experiment with simple input and output mechanisms that utilise electronics. This may be unusual and uncharted territory for a designer, but as we extend traditional design products into digital and virtual space, we also explore how design can be applied to physical applications that a user can interact with to create physical and tangible experiences.

Through prepared materials and electronic components, students will design a simple physical interaction that demonstrates how a physical input triggers a digital output and vice versa.

Physical Computing can be applied to applications where computers interact with the physical world and vice versa. The Internet of Things, robotics or physical interfaces are common applications. Physical computing refers to the use of tangible, embedded microcontroller-based interactive systems that can sense the world around them and control outputs such as lights, displays and motors.

Although this might seem rather technical in approach and application, it provides a an environment to better comprehend playfully and eventually build a connection between physical objects, computer hardware and software applicable not only to technical practices such as engineering or computer science but equally important to creative practices like art and design.

Link to external Slides

With week 11 and the semester soon coming to an end, we are wrapping up this semester's Computation in Design workshop series. Each of you should have attended 4 different workshops where you learned about different techniques and applications of computation in design practice. We hope you had a good time and gained new skills and insights into how computation and design can go hand in hand.

Please keep in mind that we are not able to learn HTML and CSS in one or two sessions, so we take a more accelerated approach by making changes to existing HTML and CSS documents.

Finally, it is important that you build an understanding of how to browse, read and make changes to an HTML and CSS document in order to make simple changes to the content.

Today we will look into basic HTML and CSS writing and editing. This is to prepare you to add content into the template for your CPJ, which will take the format of a microsite.

A template for your individual microsite will be provided. This website will serve as your submission portfolio. Today's session is about preparing for it.

Use iMovie. Simple hard-cuts will do, no transition effects required.

Video Editing

Use Photoshop, but Preview does a good job as well when it comes to resizing or color correcting images.

Image Editing

We will continue with building our website using HTML and CSS. First we will go through the Summary site which you will have to insert into your existing folder. Then, we will have an overview on how to upload your site onto Netlify.