Recent Posts
Narratives Sharing: Fillory (7)
Fillory is an adventure quest webpage done by Unit9, based on the upcoming Season 2 of U.S TV series The Magicians. This game/webpage features the main characters of the show as heroes, and brings the players through their background stories and journey. A list of quests are also available for players to completed and to further explore the realm.
Click Read more →
[Narrative Interaction] Process - Adobe Muse Tutorials
Adobe Muse Basic : https://www.youtube.com/watch?v=CKL_nGZ-DPI
Basic Motion Scroll : https://www.youtube.com/watch?v=KJMi5l9Ru-g
Slow Background Speed : https://www.youtube.com/watch?v=pXS1rLhcLvw
Dynamic Changing Background : https://www.youtube.com/watch?v=N0A0bdjpMrI
Full Screen Video Background : https://www.youtube.com/watch?v=YX8ZHpL3W_A
Background Video (Mask Text) : https://www.youtube.com/watch?v=8XmHBHRIzT8
Video Background : https://www.youtube.com/watch?v=uL6zPejT5GM
Image Hove Overlay : https://www.youtube.com/watch?v=hD-D_9-AhCE
Animated Rollover Buttons : https://www.youtube.com/watch?v=C1WhhAxKS-I
Advanced State Transitions (Button) : https://www.youtube.com/watch?v=cccc9HjiUwo
State Transition Buttons : https://www.youtube.com/watch?v=HJySNZB2CIo
Animated Rollover Buttons : https://www.youtube.com/watch?v=C1WhhAxKS-I
Parallax Background (Movement on Hover) : https://www.youtube.com/watch?v=0getLxHC2mU
Blurry to Non-Blurry Scroll Effect : https://www.youtube.com/watch?v=VnSOaaNpB_E
Scroll Zoom Widget : https://www.youtube.com/watch?v=8VDo6fflSTU
Focus-Our BackDrop : https://www.youtube.com/watch?v=GFh42syUIVg
Pre-Loader : https://www.youtube.com/watch?v=AVHcPi5d3Gs
Advanced Pre-Loader : https://www.youtube.com/watch?v=57y8rfVkACU
Load Page at Anchor Read more →
Narrative for interactivity - Sharing 3
https://www.youtube.com/watch?v=O5nskjZ_GoI
This is not really related about Narrative or anything about my project,
just that CrashCourse is one of my favorite youtube channel and this series is the “Crash Course Computer Science” series which definitely is related to all IM students. This series more or less is talking about the histories and milestone for computer science, it is also a very new series of CrashCourse Read more →
Narrative for Interaction Sharing - Learning PHP
https://www.youtube.com/watch?v=0hOMA_-jnpI
This video shows us step by steps on how to code with PHP, I find it very useful and clear. He also introduce a another software for coding call Brackets, comparing with the current software I am using, sublime I find it Brackets is easier to use and faster.
SG Cultural Festivals: sketches
Sketches for some of the different cultural festivals in Singapore.
From top (left to right): 1 & 2: Chinese New Year 3 & 4: Hari Raya Puasa 5: Deepavali 6: Dumpling/ Dragonboat Festival (Duanwu Jie) 7: Hari Raya Haji 8: Mid-Autumn
SG Cultural Festivals: map mock up
To be able to know how the map would look like, I did a rough sketch up of it with different colour markers to indicate what it is. The background would be a Singapore map since this is about Singapore cultural festivals.
Yellow represents the information about the cultural festivals or myths. Blue represents the food eaten, pink represents the decorations Read more →
Interactive Narrative: Sharing 8
https://swro.fcinq.com/
https://swro.fcinq.com/
The website allows the user to login in via their facebook messenger or continue via a visitor view. As they progress on there is a mission they have to accomplish. It seems like a documentary game narrative as the user gets to experience the whole mission game play.
Difficulties: When referencing the website of smooth flow, I need to think of Read more →
[Narrative Interaction] Inspiration - A State of War
A State of War (http://www.fornasetti.com/history)
An interactive website to to commemorate the centenary of World War 1
Currently, I have difficulties trying to ‘unify’ my visuals (illustrations) so I was looking around for websites with similar theme as mine. I came across this ‘A State of War’ website and thought that it has an overall unifying look using minimal colour scheme : black Read more →
Interactive Narrative: Sharing 7
https://my.pottermore.com/patronus
The website is a simple click interaction where you will be able to create your own creature depending on your choice. You can read more about the creature you have created here: https://my.pottermore.com/user-profile/patronus. Despite not having an explicit storyline, the user can interact with the creature.
It is an interesting approach to allow the user Read more →
[Narrative Interaction] Process - Web Mock Ups 1
The screens below are my first phase of mock ups for the website as I tried to visualise how they will look like. The designs are not panel-by-panel but rather frame-by-frame as it is quite hard to also include the animation/transition of the elements.