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'!
We're having abit of issues with the lower third, as Mr.Muzamir noticed that right now, the transition of the letters looks like it is typed out from a typewriter. So, he gave a suggestion that we animate the letters to make it look like it is being written, in a way that would help the children to learn how to write properly as well.
But now that we are doing a 3D model, we're having some issues because we don't know how to make that kind of animation on Maya. I found other samples of lower thirds that in a way, does not look like a typewriter but still has an educating factor to it.
Winnie the Pooh
The animation of the honey pot is synced with the syllables of the letters.
What we have in mind is that, when the letters appears on the AR, there will be a little solid (maybe a little ball) that bounces across the letters similarly like the one shown by Winnie the Pooh.
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.
Instead of putting the whole 'A stands for Apple' text in the animation for the children to read, we decided to change a little bit on how the text would appear.
We'll spell out the letter word by word, so that the children would be able to read the letters and pronounce it at the same time. There will be a narrator that will spell aloud the letters for the children when they play the animation as well. For now, we chose the colour Red as the letters appear, but when the narrator reads the whole sentence aloud, it will turn to Black.
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.
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.
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.
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.
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.
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!
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.
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.
Finally got the concept finalized. We were worried that our 3D modelling and animating skills is not competent enough and due to the time limit, we weren't sure if we would be able to produce something such as that.
So I have proposed a solution to the problem.
Instead of 3D model popping up once the marker is scanned, it will load a video that would seem as if the marker came to life.
The animation will be smooth and continuous between the markers, to seem as if Adrian is walking from marker to marker.
Concept board
The flash card will start off with an introductory video which is held under one flash card marker.
The main character named Adrian will introduce himself and give an intro of what experience he will take the child to throughout the flash card game.
Each marker will be designed and the images produced would be the first frame of the animation for the flash card. This will ensure that is smooth.
One of the storyboard
The storyboard has also been produced.(From the letters A - C)
Above is the storyboard of the letter B as an example.
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.
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).
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.
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).
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.
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!
I have tried searching for tutorials on how to create an augmented reality game. It must be a real tedious job because it is extremely difficult to find a good tutorial online.
Having said that, over the weekend, I have attempted on creating an AR using D'Fusion. D'fusion compared to Metaio is much harder to grasp. I haven't had a successful AR from D'fusion but I had hope to master it by the end of this wednesday.
With last week's consultation with mr. Razif, he had introduced to us ARToolKit and ARMedia. To be able to work with him, I thought of researching this software and understanding how it works.
ARToolKit - Is a C and C++ language software. Mr. Razif did mention and explain about this language in softwares therefore I understand what it means and how it works.
Programmers are able to calculate precisely the user's viewpoint so that the AR would work well in real-time. What worries me is my lack of ability to program as I am not a programmer.
So how does a person create an Augmented Reality game?
Through Mr. Razif, an AR game is created with the game first and then brought into an AR software.
In conclusion, create your game off of Flash/ Maya and then import it into D'fusion/AR Media.
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
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.
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.
For this module, we had decided to take on interactive games design using Augmented Reality.
The idea is basically like "Hide and Seek".
Unlike regular games, augmented reality allows developers to come up with ideas that will force the players to interact and move around and the game interacts with the environment that the player is in as well.
When the user launches the AR app, objects will appear and the player has to move around the objects to look for the character. One character is found, players will have to tap onto the screen and bring the character back into the device.
An animation of the character will be triggered once the character is being tapped on, players will then have to tap on the character again before he runs off.
The concept will be similar to Total Immersion's "Interactive games book";
The only difference between our game and Total Immersion's is that our game will take place in the environment that the player is in.
Software Research:
There are 3 software among the many AR software that we is possible to be used to develop this idea.
1) Metaio
Metaio works alongside Junaio, therefore the Junaio app has to be downloaded and available on the mobile device to scan and launch the AR.
2) D'fusion D'fusion is the running software of Total Immersion. This is the software used to produce the interactive game book.
3) Vuforia Vuforia is a product of Qualcomm Technologies. Below an example of AR that was developed using Vuforia.
Besides that, AR t-shirts by "Chestburster" are also made possible by Vuforia.
Software comparison: Metaio Advantages: Metaio can be downloaded for free. Uploading and publishing on Metaio Cloud is also free. Disadvantages: The trial version has limited functions and does not offer much flexibility and freedom for the developers. It also takes a long time to load the 3D object and needs a QR Code. Markers feature that can be used are only image detection, environment tracker and 3D object tracker. (very limited compared to the others).
D'Fusion Advantages: Has multiple options and is free and gives more room to explore AR. Some of the interesting features of D'Fusion are motion detection, face tracking and many more that is not available on Metaio.
The markers are detected and animation is played very quickly compared to Metaio, and it does not require a QR code.
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.
Initially, both of us agreed that we want to implement 3D into the gameplay, so that we could add some realism into it. Hence, we've decided to use Maya as our main tool for the animation. For that, we found a plugin for Maya by Inglobe Technologies called the ARmedia Plugin.
It enables users to visualize their 3D models using Augmented Reality directly in the real physical space which surrounds them. In a very precise sense, 3D models can be visualized out of the digital workspace directly on users' desktop, by connecting a simple webcam and by printing a suitable code.
"a way of fusing the real and the virtual world by overlaying digital data on to real-world analogue views. Augmented reality applications are appearing in products as diverse as T-shirts on fashion cat walks, interactive games, CVs designed literally to speak to the future employer and jobseeking tools.
And what’s more, anyone with a mobile phone or laptop with built-in video capability can augment and extend their reality with easy-to-use applications. "
Basically, Augmented Reality is a layer of CGI that is triggered by the real world. It is mostly used for advertising and marketing, but today augmented reality has made its way to t-shirts, interactive games and navigations.
"This is an example of AR on t-shirts. Very impressive."
2) How does it work?
AR has what is called markers. These markers allows the AR technology to detect and subsequently react to the location or object that is being placed in front of it. Animations or things that appear are customized and programmed using softwares such as Metaio, Daqri, Layar etc. (Source: http://en.wikipedia.org/wiki/List_of_augmented_reality_software)
There are two ways on how the application can work: Marker-based and location-based.
From CWJobs webite, a proper explanation of how that works:
"Markers work by having software recognise a particular pattern, such as a barcode or symbol, when a camera points at it, and overlaying a digital image at that point on the screen. If the image is three-dimensional or animated, the effect is of a digital experience unfolding on the surface upon which the pattern is printed.
Location-based applications use the ability of a particular device to record its position in the world and then offer data that’s relevant to that location: finding your way around a city, remembering where you parked the car, naming the mountains around you or the stars in the sky. "
3) What's different about developing Augmented Reality Applications?
Here comes the technical part of the whole thing.We are not an IT expert nor will we ever be, but it's good to know how it actually works. So from CWJobs website :
"Most augmented reality applications rely on superimposing either 3D-generated computer imagery or some form of descriptive knowledge over the real-time images obtained through a camera, webcam or phone. This requires a good understanding of image processing and computer vision techniques, mainly for tracking either markers or the natural features on which this imagery is superimposed.
Computer-generated imagery has to look realistic and be properly aligned with the real environment in order to create an authentic impression. Most of the applications are designed for the general public so a good understanding of intuitive user interfaces is also required to provide a seamless experience."
4) What other skills do we need?
-A mixture of advanced computer vision skills, 3D modelling and desktop, web or mobile programming.
5) AR Platforms to work with?
We found a lot of platforms to work with, but naturally there are pros and cons to every software. We are now leaning against Metaio which functions alongside Junaio. Comparison of each softwares along with it's strength and weaknesses on the upcoming post.
6) How can you get into AR?
Simple. By joining a community of developers who are utilising the same technology. We will get into this soon.
7) Where's AR going to be big?
Retail is one of them many opportunities for AR applications, especially online.
8) What about education?
It's not really relevant to what we are going to do, but it does open many doors to support learning experiences.
9) What's the future of AR?
It would probably be the main tech in the future. Instead of depending on cameras and screens, it would likely appear in real life like some sort of hologram.
10) Any other uses?
Actually it has already been implemented in military goggles that provides radar data that targets missile attacks, just that we were not aware that it was augmented reality. Also, it is now used for navigations in cars.
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.
.gif)
