Xiyuan Chen

Tech Stack:
HTML, CSS, JavaScript, and Bootstrap (CSS classes only)

With BadFakes, you can test your ability to identify Deepfake images and videos. This was originally made as a semester-long project responding to critical AI topics for the "Digital Media Studio 4" course. I spent some time researching and experimenting with Deepfake applications to make and select the images and videos. It has since been revamped based on the feedbacks I had received at the end of the semester, with more efficient code, a cleaner design, and some usability improvements.

Tech Stack:
HTML, CSS,and JavaScript

This was made as the client-side component of a fullstack project for the "Web Programming" course which focuses on HTML, CSS, JavaScript, and PHP. This assignment incorprates a fake client "Russel Street Medical", which I was "contracted" by, to make a 2-page website. I was provided with clear instructions on what to include, but it was up to me to decide the overall layout and how some features are implemented. However, as it was a programming course, I didn't spend much time polishing up the design.

The full project is not available yet.

Design Tool: Figma

This is an interactive App designed to educate and engage users, and facilitate direct participation via email sign-up, a built-in game, and online discussion and community. The project focuses on the endangered species - red panda and is the combination of a simple RPG and an online forum

The character movement in the built-in game, as shown in the demo, was created in GameMaker and then recorded as videos.

Design Tool: Figma
This was a 2-person group project responding to a given design brief.

My team was assigned to design a mobile App for a fictional client - OZ Style Collective, a group of students from various Australian universities, who was setting up a one-day fashion show to showcase their work. The event organisers wanted to make it easy for all participants and visitors to attend the event and get to know the designers and their work using a mobile app.

Our client is a group of students who wants the participants and visitors to have a great experience in the fashion show they're hosting. They also want these people to know and remember them as well as their works. It was clear that our main problem would be to design a mobile App that can achieve these two goals.

The full project started with user research, including competitive audit and interviews, and ended with high-fidelity wireframes created by my partner.

Full case study on Figma