SW@UAL_U6(2023)

circuit board theme

Project 1

Narrative & Voice

“London-A

Project 1 Action map

TBC To be continued

Project 1 Development Enquiry

Primary Research

Visit to London Dockland Museum

Primary Research London city views

Secondary Research

Quotes from

The Generic City by Koolhass Rem

Paris can only become more Parisian. It is already on its way to becoming hyper-Paris, a polished caricature. London, its only identity a lack of clear identity, is perpetually becoming even less London, more open, less static.

Project 1 Development Enquiry

Drawing & Prototypes

Prototype 1:

History Reference: The Great Smog in London in 1952

Site-specific display and installation

I did this drawing from reference videos to consider the display setting, which would be behind Heathrow airport walkway.

edited in photoshop plan to render a video of airplane across smoky cloudy sky in liquidified effect

Prototype 2: edited in photoshop + observation drawings of baggage in unwrapped stages

Project

Simulate the baggage carousel in 3D modelling and add interactive function

Feedback & Discussion

Develop direction

1.Fetch data

2.Game Planning

Reference:

The Vanderlande Baggage System has more function besides transport, such as auto-identification etc. Potentially I could incorporate more elements into my game environment.

Project 1 Development Proces white model of game map in SketchUp

Materials& Textures Applied to Model

Asset-Cabinet Box downloaded from Unity Store and imported into scene

Unity Gameplay: Automated Baggage transit

Path Follow Script

Create Path Follow Animation in Unity

Referenced tutorial:

https://www.youtube.com/watch?v=h-KOTKx_ q2o&t=15s

https://forum.unity.com/threads/movegameobject-along-a-given-path.455195/

Create empty C+ Script - Node - to getcomponent

PathFollower

Project 1 Development | Communication

Open Studio & Feedback

Development Direction

Further Developments

Collision effect on target item (Unity)

import FPS weapon in scene link mousepressed to controller’s trigger. (Arduino & Processing)

Project

User

Additionally I want to build a physical controller installed on travelator, for passenger(user) to interact with the wall dis play(game) in real time.

Outside of airport, the game can be uploaded to PC community platform, and user would navigate using keyboard and mouse, the controller will be shown in first person perspective as above.

?In consideration of the travelator with passenger are all moving, including the handle bar, I thought about where to mount the controller and how to let users initiate interaction with ease. And I was not sure the shooting element is appropriate for public space.

I found the observation telescope seen at airport, blends in with the environment. It would be an inspiration for style and structure of the game controller.

*Telescope on Observation deck at airport

Project 1 Outcome

This video of game demonstration is recorded in Unity while I change display(camera) manually to capture different perpective views of the game environment.

OneDrive Link:

https://artslondon-my.sharepoint.com/:v:/g/personal/s_ wu0120171_arts_ac_uk/EVObwL9BU_ZLgqBC87UWRLAB7NF7E5lM56LZ2RrjSt8X7g?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=5re4f7

Project 2

Narrative & Voice

The New Classroom

Project 1 Development | Enquiry

Task 1: Visualize Educational Experience at CSM BA GCD

Concept: ...I thrive under pressure

Process:

Create Loop in Adobe Illustrator and add gradient for the 3D effect

Task 2 Visit to V&A Museum

Task 3 Curate workshop in classroom

Ai Image Generation Workshop

Mapped out in Adobe Illustrator and Photoshop (Curve lines and distortion effect)

The object selected by peer was Dali’s Lip Sofa in V&A Design Gallery. During reseach I found the lip sofa is part of a entire room display, from distortion of an actress’s face features. This inspires me to explore facial recognition technology and Augmented Reality filter.

Project 2 Development Enquiry

Ideation & Proposal

1-VFX for lecturer

Cross-disciplinary lecture resource

2-Data Integration

A more efficient search engine on relevent topics

3-User input Interactive elements

I researched on decentralised Tech, Metaverse, and Artificial Intelligence Tools.

Project 2 Development

Enquiry | Research

Visit to Exhibition

Third World:The Bottom Dimension Serpentine Gallery

I noticed this event from LSE student society page and network with the organiser.

I thought about the potential partnership between student societies in London with mutual interest in Art and Technology, to share resource and make connections more easily.

Although I am introvert, but I could push myself for new knowledge and opportunities, and I think building this web platform to connect people would enable me to be more extrovert and expressive.

However...if a conversation I made could be recorded and accessed by different people, I would achieve the desired network purpose without repeating myself.

Ideation on Network Through New Media

Project 2 Development Process

Website Outline

I have a basic idea of the website outline. And went to Javascript Coding Workshop with Technician Felix Loftus in CSM Technology Lab.He gave info on coding on Glitch and start building by html and style website by css.Later I also asked him on Responsive Web Design(RWD) for display on both desktop and mobile device; and to build database to store user inputs(recorded talks).

Screenshot of html and css script in Glitch editing page

Drafted in Adobe Illustrator

Project 2 Development Process

Concept ANTenna

It was difficult for me to start the visual design for website because Art and Technology are too broad to visualize accurately. And I want to have a cohesive identity between the website and the character model. So I thought of concept of ANTenna(ANT in abbreviation for Art and Technology, at the same time indicate the virtual avatar is inspired by ant and antenna.

Research on how antenna works and was inspired by the revolve action of electromagnetic waves.

Project 2 Development Process

Web Interface Design | ANTenna

Adapted from a font, I expanded the typeface and removed certain elements in Adobe Illustrator.

3D Chrome Text Effect | Photoshop Text Tutorial: https://www.youtube.com/watch?v=V5MnJCRNISI

I turn the title ANTenna to 3D Chrome by Photoshop, and done a loop animation of it revolving, inspired by the principle of how electro-magnetic waves transmit in antenna.

For the background I used previously learned knowledge in in Touchdesigner to create a noise footage. I adjusted the contrast level and attempt to achieve the effect of ant group moving.

Project 2 Development Process

Character Design | ANTenna

research on types of antenna

reference image

I used tracing paper and sketch the ant facial feature in proportion to human’s.

The ant’s antenna is converted to electric ones and extrude from the eye corner.

I researched on ant biology and proportion, for potentially I also want to have hands and body tracking with the AR filter

Project 2 Development Process

Blender Material and Final Model

Project 2 Development | Communication

Spark Studio

For some reason the rendedred texture I applied in Blender does not show up in Spark Studio. I am trying to resolve this and develop animation for the filter.

Face Recognition and Filter Reference

Project 2|The New Classroom|Outcome

https://project-antenna.glitch.me/index.html

OneDrive Link: (recording of browsing website)

https://artslondon-my.sharepoint.com/:v:/g/personal/s_ wu0120171_arts_ac_uk/EXadyGHHU7hCgvk9OwAaKRkBQXRBG9Pnj0T69ZD-A82ojw?nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJPbmVEcml2ZUZvckJ1c2luZXNzIiwicmVmZXJyYWxBcHBQbGF0Zm9ybSI6IldlYiIsInJlZmVycmFsTW9kZSI6InZpZXciLCJyZWZlcnJhbFZpZXciOiJNeUZpbGVzTGlua0NvcHkifX0&e=JwojA9