Master Of Animation, Games & Interactivity
Master Of Animation, Games & Interactivity

https://youtu.be/qmRPMBpa5Po

Hi guys, my name is Daien Lyu, and this is my work in progress video 2, covering from week 3 to week 4. According to the project plan, I was set to finish up the prototypes and theming experience. So let’s see what I’ve been doing for this two weeks!

So here is my checklist, showing what I am supposed to accomplish within this two weeks, once these are done, I can push my project to the next phase, which is producing in a game engine. 

No. 1 is style guide and UI Design direction, this helps me get visuals always on track in terms of styles, positions, and scales. 

First of all, the essentials is the face, icon. I decided to combine physical collection and digital representation into halves to present this app, and finially the plastic wrap on the surface, all is leaning to the face of vinyl records, helping audience to recognise the app.

Determining colour palette, buttons and important UI elements can help me illustrate the overall tone of the experience, especially the left side of the style guide, which settles the vintage, retro vibe, while on the right side, there is also something furturistic elements going on to leverage the seasoning, such as rounded corners and curved typography. That’s also why I decide to continue with AR experience, we remember the good old days not just to feel settled, but to explore what more can be possible and friendly.

Next, inspired in Professional Pre-production, I decided to implement the prototype through flowcharts, so first I’ve written every interface with texts, including goals, content and even animations, and then...

I illustrate the wireframes following up the flowchart and style guide, so that gives me a general outline of what my project may look like, so I can continue to decorate them. I can give you a preview on this.

So to put it in an animation term, these are the thumbnails of the whole experience, which are the essentials of the precedures, and I start to decorate them.

After applying themes to the wireframe, the whole picture gets clearer, and even helps me to think further about the usage of the UI elements. For example, I decided to polish the menu buttons by adding a peeling effect to feel like it’s really unboxing a album.

During this process, I’ve also bred two variables of UI Design, which are flat design and skeuomorphism design language. So I’ve held a poll on Teams, asking your guys for opinions. And thanks to you guys, I realsed that too much skeuomorphism design could distract user from using the main function, which may be a clutter brather than a feature.

Next up, it’s the demo video with wireframing and prototyping, I believe that this is a better to understand how to play.

Next up, the animation demo. This is also a demo, but this version adds themes, animation and background, which could be more helpful to me producing it in game engine. It takes me a while to finish the animation and other details for this demo, it’s not perfect though, but it provides a clearer visualisation.

https://youtu.be/qmRPMBpa5Po

The next clip I’m gonna show is me producing the home page peeling effect on after effects in this demo.

Next up, it is bonus work that I came across during the production, but these matter as well so I cannot skip them. First of all, I bought a real vinyl album myself to test myself and get an overall knowledge what is inside and what content will be presented.

And here is the scannings, although some images may be blury so I replace them with stock photos on the internet.

What’s more interesting enough, I had a consultation with a friend of mine who is a vinyl record collector, I reached him and asked for some opinions and materials that I can learn from, and some knowledge which you will gain when you purchase enough amount of vinyl records. So yeah, that helps a lot.

For the next step, I will continue learning Unreal Engine to create a scene where camera can recognise an object with AR, and modelling sklls on C4D. But before doing anything fancy, I will be there check my asset list again just in case there is anything important missing.

Thank you!

About This Work

By Daien Lyu (Dane)
Email Daien Lyu (Dane)
Published On: 15/08/2022