3D Adrian

I've finally finished modelling Adrian in 3D, but I did not refer to the previous tutorial that I've posted because I realized that they are modelling a more realistic model whereas Adrian is very stylized and of different proportions.

So, I started a new file from scratch and here it is!

Because this is a humanoid character, I've asked Mr.Kim on how to properly animate Adrian. He said that I need to add the spines for him and that will take some time, so he said he'll show me how to do it. And for the eyes, I left that part because I wasn't sure how am I gonna animate it to blink if I build the sockets (based on the tutorial video I watched). Mr.Kim said that since this is a stylized character, I don't need to make the eye sockets, but put a button-shaped polygon for it. 

So once we get the spines done, we can animate it with the other objects and hopefully, completed in time! :D Amirah is still animating the letter 'Adrian' and 'Aeroplane' and that would be it for letter 'A'! 

Bringing Adrian to 3D

Following our previous tutorial with Mr.Muzamir, he suggested us to model Adrian in 3D instead.

I've never actually tried modelling a character before (I'm okay with objects, but not an actual finished 3D character), so I went to Youtube and look for a video tutorial.

Since Adrian is of a chibi proportion, I had to be specific and look for a chibi modelling tutorial :D

And here's what I've done so far!

I'm not exactly finished with the tutorial, I've only done the topology of the head. Now I need to import an image of Adrian so I can tweak it as close as how Adrian originally looks like.

Stay tuned!

Research on Colours

We were asked to do some research on colours that would appeal to children, so I went on Google and here is what I've discovered.

• Blue - In a study at the Surrey Baby Lab, babies tended to look longer at certain colors for the longest amount of time. One of these colors in the study was blue. Much of this hue's appeal is in the type of feelings it conjures. Blue is often associated with mellow feelings like peace, tranquility and calmness. Blue is synonymous with water, ocean life and swimming pools.
  
  Read more: http://www.ehow.com/info_8699422_colors-appeal-children.html#ixzz2je1rxVcE
  
• Red - Another bright color that has mass appeal with children is red. An emotionally intense color, red has high visibility, which is the reason it is used for stop signs, traffic lights and fire equipment. When you see something red coming your way, you are not likely to miss it. Red is also used in many ways to indicate courage and valor.
  
  Read more: http://www.ehow.com/info_8699422_colors-appeal-children.html#ixzz2je1wmTtT
  
• Orange - Orange is a very hot color that is also very highly accepted by young people. Not as aggressive as red, the hue increases oxygen supply to the brain, according to Color Wheel Pro. This effect creates a sensation of heat and produces an invigorating effect in the brain, which then stimulates mental activity. Orange is also a popular color because it is the color of many citrus fruits as well as the shade associated with fall and harvest.
  
  Read more: http://www.ehow.com/info_8699422_colors-appeal-children.html#ixzz2je27S22L
  
• Purple - Rarely found in nature, purple combines two other popular colors to produce a powerful color on its own. According to Color Wheel Pro, purple has the stability properties of blue with the energetic capabilities of red. It is often associated with magic, wisdom and mystery. Purple is often a favorite color with pre-adolescent children, but babies also showed interest in the color during the Surrey Baby Lab study. Purple makes a great color for girls fashion but it is also a color fit for a king because may royal robes are dyed in this particular hue.
  
  Read more: http://www.ehow.com/info_8699422_colors-appeal-children.html#ixzz2je2RAUva

Most of the websites also states that children prefers blocks of bright primary colours, particularly red, as red is the first colour that they distinguish. 

Sample Animation

I manage to complete the first animation, which is for the letter 'A'! 

The feedbacks given were;

• For the lower third, have more considerations for the colours that would attract the children to read it
• Take note of the fonts used, maybe 'Arial Black Rounded' for instance
• Think about how the lower third can help the children to read, since it is targeted to children aged between 3-4, research on how much they can read
  

Other Characters

The characters/objects that are going to be in the animations are;
A - Adrian, Apple and Ant
B - Boo, Ball and Book
C - Chair, Cat and Cow

Mr.Muzamir suggested that the rest of the characters should have the same style as Adrian. Now that we've broken down the list, we narrowed down our characters to the Ant, Cat and Cow that would require the same style as Adrian.

Here are the tryouts for the character designs :D

Behold... The apple.

 The rest of the objects would probably appear in the next post. Stay tuned!

Angie & Amirah

Simple Tryout

I did a simple animation of Adrian waving to the screen using Flash. Although I'm not sure why the quality of the image is so .. pixelated. It could be because of the setting that I used when I exported it as a .gif format.

Angie.

Character re-design

For the previous character design, we received feedbacks from Mr Muzamir:

- Character has no root.

- Needs more stylization on colors, cartoons style and strokes.

- Clean up the strokes.

- 

Therefore I have done a few research on cartoon characters and the style. 

What I wanted was a character that has a human feature but at the same time cartoon-ish and stylized. 

The main character, Adrian also has a cheeky and playful nature, therefore it should reflect on its face. 

Some good examples can be seen below:

Cheeky boy characters are usually with a cap and has a mischievous look, that can be achieved through the eyes and mouth.

The style that I am interested in which has a cartoon element but also has a human feature which is noticeable.

Cartoon from "Calvin and Hobbes" is also used as reference and is my favorite style among others. 

A style that Lai Yenn was interested in is known as the chibi style which plays with proportion. It has a big head and a small body and usually comes with big eyes. 

 Characters that inspired Lai Yenn are chibi characters like Ni Hao, Kai Lan and Pucca.

 Both of us re-designed Adrian, of different styles, but the same colour scheme that we've come up with earlier. 

Left: Designed by Amirah, Right: Designed by Lai Yenn.

Amirah & Angie. 

Introduction on Adrian

"Nice to meet you! My name is Adrian!"

"Do you know what your alphabet stands for?"

"Let's find out together!" 

-Amirah & Angie 

Using ARmedia

I've been searching for tutorials online for ARmedia and so far, there weren't many tutorial videos available on Youtube besides the ones that we've posted on earlier posts.

But I've manage to find a couple of videos that displays how ARmedia works on iOS and Android.
For iOS

  
For Android

I've also managed to find another video that shows how ARmedia supports animation, although the animation was done with Autodesk 3ds Max instead of Autodesk Maya.

ARmedia supports basic animations or 3ds Max.  

And on their official forum, they have several methods on overcoming some of ARmedia's limitation when using Maya. 

For instance, ARPlugin only supports several materials which are; Lambert, Blinn and Phong. Any other materials would be displayed as a grey Lambert. And as for the animations, they do not support animation systems that uses Motion Path or Constraint. Instead, they offered a solution by using a Bake Simulation technique that is available in Maya itself. 

Taken from: http://www.inglobetechnologies.com/forum/viewforum.php?f=22

Angie. 

Flash Card Feedbacks

We've just presented our updated Flash Card idea to Mr.Muzamir and here's the feedback that he gave us:

• For the voice over for the character, make sure it synchronizes with the video as well. (We have a back up plan where if we can't make it sync, we will only sync the gesture of the characters and keep the facial expression as smiling all the way. We also have another option which is to use green screen for ARmedia where we then have to rotoscope the character. Otherwise, we will do a video for it).
• For putting several markers to act as one big marker, try it out first on ARmedia and make sure it works. (We're thinking of narrowing it down to 3 markers, so that the image would be smaller and the interaction between markers would only occur within that 3 markers, instead of 5). 
• Start designing the character (Adrian) 

Angie. 

Flash Card Game Story (Developed)

So our previous idea was too simple and needed to be developed further. So I came up with an idea to make it interactive and story based.

Concept

Similar to Dora the Explorer, Blue clues and anything of that genre, this interactive AR flash card will bring children to a whole new learning experience using Augmented Reality. Our main character, Adrian will help children learn the 'ABC' through a series of interaction.

Mission of the game

Children will be led by Adrian through the story. They will have to find the next letters to proceed on.

Technical

The animation prompted will work with audio. Adrian will be speaking to the children and designed in such a way that it is actually interacting with the child.
The animation can be modeled using Maya and the AR will be developed using ARMedia.

Flash Card

We have decided to narrow down our idea to suit our capabilities.

Our modified idea would be making an AR flash card targeted for young children.

THE CONCEPT

Basically it works like a regular 'ABC' flash card. The marker would be the flash card itself, once scanned, it would display the object that the letter stands for.
The models would be done in Maya and the AR side would be done with the ARMedia plugin for Maya.

FEEDBACK

-Nothing special about the idea if the object only comes out as a static object after scanning it. It does not promote the interactivity and does not benefit the consumers. Might as well use the usual flash card with images on it.

- Idea needs to be further elaborated.

-Maybe have interrelated story between the markers/alphabets. (have a story).

ARmedia Test

I managed to download ARmedia plugin for Maya few weeks ago but when I tried to look for online video references, there weren't many for me to refer to. Most of them were only showing the finished product and projected them from their webcam with the printed marker.

Luckily, I manage to find an installation and user guide that was released by the company themselves.
http://www.inglobetechnologies.com/en/new_products/arplugin_maya/download/_current_/UsersGuideWin.pdf

I've tested out with Maya, with a model that we got from Mr.Kim from our previous semester, and a default marker that the plugin has provided. And it seems to be working fine! I've tried using my own marker before this, but I're not sure why it doesn't work.

Nevertheless, we're still trying to find out on how to publish the file, because the file that we exported was in an .armedia format.

Once we manage to figure that out, we'll post the outcomes here!

-Angie-

Testing with Metaio

We decided to test Metaio first. This is because we had consultation with Mr. Razif, expert of Ar and would assist us, he was more familiar with ARMedia at the same time, he is able to look into Metaio since Taylor's provide the full version of Metaio.

We tested on one of the software called "Metaio". Unlike D'fusion, Metaio is much straight forward and does not have much features as it is the trial version. We have yet to try out the full version of Metaio that is available here in uni.

(First QR code with Metaio)

(With video)

First of all, you will need the Junaio app in your mobile device to be able to scan and load the AR.

The splash screen of Junaio upon launching.

Press the button on the top right side to scan QR code.

You're ready to scan the marker.

After launching Junaio, scan the Qr code and once Junaio has finish loading the page, you will need to scan this marker. 

Scan me!

What I concluded is that you can have the same marker for both QR code because the AR that is loaded depends on the QR code scanned. 

Meaning, the QR code will connect the device to the cloud which stores the AR. 

Observation/ Conclusion:

Metaio takes a longer time to load the AR. It is not so suitable to be used for real time.

For our game, we need 3 or more different markers to be able to be detected and launched. Metaio does not allow this action and the reason:

• Metaio is not a standalone app/software. It needs QR code to be able to read the marker. Therefore, one QR code only reacts to one marker at a time. 

-Trying it out-

Solution: Use a software that does standalone and wraps everything into an app. This way all the information will be saved in the cloud and can work together at the same time. (Can detect all markers simultaneously)
We are now looking at ARMedia (ARToolKit software)- URL: http://www.armedia.it/dev_tools.php

Improvising the Masterplan

After further discussion and judging from our capabilities, our previous idea of 'Hide and Seek' was too advanced for our level. We've decided to narrow down the idea into a smaller scale but still has the same 'Hide and Seek' elements.

Instead of using the environment as our main background, we've decided to refine it and make it more interesting by using the concept of card games. There will be different cards that displays different objects when scanned, and users would have to put the cards together to form a scene for the game to start. Once prompted to start, the main character would hide behind these objects and users would have to tap the character to get score. There will be a time limit to the game, and users will need to compete for the high scores.

D'fusion: Getting our hands dirty!

We've finally decided to work with D'fusion due to it's versatility. It offers more options and we think it would be much more suitable to be used for our games design.

We've looked into a few tutorials on D'fusion and like Metaio , D'fusion has a plugin for Maya therefore, any 3D animation has to be exported using said plugin.

Although it seems much more advanced than Metaio, it offers more variety and is much more specific in terms of tracking and projecting. 

- Amirah  & Angie - 

Consulting with the Expert.

We've spoken to Mr.Razif, sound designer and Flash game expert who also happened to be our lecturer in our previous semester. We explained to him about the idea that we had in mind, about how we wanted to incorporate AR into our game. He said he has only tried AR once, but he asked us to come up with a sketch of our ideas and show it to him so that he has a better understanding on how to help us out.

Nevertheless, he said he'll try to work something out for us in the meanwhile. 

-Angie-

UPDATE [20th September 2013]
We asked him on our technical issues, like if we could include randomizer and input Flash into AR. He said it was possible, with a Flash input called Adobe AIR for iOS. But he mentioned that he is more familiar with ARmedia, which is the first software that we looked into.

Right now, we have 3 softwares to try out, which is ARmedia, Metaio and D'Fusion.

-Amirah & Angie -  

Introduction

Hello there, we are semester 4 students of Interactive Multimedia Design. Our names are Amirah Shukri and Woo Lai Yenn and we teamed up for this module, Experiential Design, to work on an Augmented Reality game.

 Before we proceed, we have done a number of research on Augmented Reality and what it takes to develop a good AR game. 

We chose Augmented Reality, also known as AR, because it is very different from we are exposed to and it is also the latest technology in the industry. We would like to go to the extent of challenging ourselves and to explore the many possibilities that AR can offer.

We were researching on what type of AR products were there in the industry when we came across this video. We find it intriguing on how people could interact with the virtual game as if it was there. This brings video games up to a whole new level and we hope to be able to come up with something similar.

Posted by:

-Amirah Shukri & Lai Yenn-