Bibliography

Augmented reality Tutorial. 2012. Augmented reality using a webcam and Flash | Adobe Developer Connection. (Source files) [ONLINE]                                                          Available at: http://www.adobe.com/devnet/flash/articles/augmented_reality.html. [Accessed 26 October 2012].

papervision3d – Open Source realtime 3D engine for Flash – Google Project Hosting . 2012.  papervision3d – Open Source realtime 3D engine for Flash – Google Project Hosting . [ONLINE]                                                                                                                    Available at: http://code.google.com/p/papervision3d/.                                         [Accessed 26 October 2012].

Free, open-source framework | Adobe Flex. 2012. Free, open-source framework | Adobe Flex. [ONLINE]                                                                                                             Available at: http://www.adobe.com/products/flex.html.                                        [Accessed 26 October 2012].

saqoosha/FLARToolKit/en – Spark project. 2012.[ONLINE]                                      Available at: http://www.libspark.org/wiki/saqoosha/FLARToolKit/en                    [Accessed 26 October 2012].

Maya – 3D Animation Software – Autodesk. 2012. [ONLINE]                                     Available at: http://usa.autodesk.com/maya/.                                                         [Accessed 28 October 2012].

Google SketchUp . 2012. Google SketchUp . [ONLINE]                                              Available at: http://www.sketchup.com/intl/en/download/index2.html.                  [Accessed 12 November 2012].

TUTPLUS. 2012. Beginner’s Guide to Augmented Reality | Activetuts+. [ONLINE]    Available at: http://active.tutsplus.com/tutorials/3d/beginners-guide-to-augmented-reality/. [Accessed 16 November 2012].

ARToolKit Marker Generator Online 2012. ARToolKit Marker Generator Online [ONLINE] Available at: http://flash.tarotaro.org/blog/2008/12/14/artoolkit-marker-generator-online-released/.                                                                                                                 [Accessed 20 November 2012].

Conclusion

When starting this project i was quite daunted by the scale of the task that i had set. I really did think that i would struggle a lot more than i have with the whole learning curve alongside the design process. I am proud that i have managed to teach myself something new and I am very happy with what i have achieved in Augmented Reality with such a short amount of time. A lot of my success is down to the great tutorial from Samuel Asher Rivello which i mentioned earlier in my blogs. Most of my knowledge has been gained through him and i used his original project to build the blueprints to my own. I would not have done this usually but as i am entering a design competition it was imperative that i got the technical side of the project finished as quickly as i could.

I do think that i could have achieved more on the design side of the project but i am pleased with the card that i have submitted. Even if i do not get very far in the competition it will still look on my cv to say that i have tried.

I will continue to look into augmented reality as it is constantly growing and i am eager to look more into 3d modelling. This is partly due to the problems that i have had with textures and colours throughout this project and i would like to get to the bottom of it. Even now i am still finding strange problems with my model and it appears that different browser handle them differently.

Getting there

With all of the elements to my project pretty much complete and coming together it is now time to create a simple webpage to house the .swf file. I have published my project from flash with a html version of the application and it is now ready for web delivery. With all of my files uploaded to my server the application is now ready for public use at http://www.mldigitaldesign.co.uk/augmented_reality.html

The page itself is very simple but it is the content involved that matters the most. I have also included a download link for my unique marker so anyone can try it out even if they don’t have a copy of my business card.

As this page is a representation of my work and i am quite proud of what i have achieved i will take the time after this project to improve upon this page and make it an essential part of my online profile.

Testing the Card

It is now time to test whether or not my business card actually works. Until now i have been using my marker at its full resolution but now i must test to see if it works when i have shrunk it down to fit on a 85mm X 55mm business card. I have printed out a copy of my card on semi-glossy photography paper which will resemble the texture of plastic business cards better than normal paper.

I am quite happy with the way it works and how easily the camera tracks it even when its so tiny. The quality of the print from my inkjet is not very good and even with part of the marker not printed correctly i am surprised it can still be picked up.

 

For future reference i may try to fit two markers onto a single face of the card and create two models which interlock with each other in an interesting way. Also now that i know the marker does not have to be fully complete i think i could have played with different designs where the marker is slightly more blended in with the overall look of the card.

The Business Cards (Continued)

The plastic business card competition run by HarryBugg® which i am work towards produces high quality business cards which stand out. These hard wearing cards are designed to be more like a credit card which anyone can keep in their wallet or pocket without it being damaged.

The business cards which this company produces all have rounded corners and this is something that i must take into consideration before printing. Thankfully i am signed up to a clever website which allows you to make conceptual 3d designs to see how things may look in the real world.

I have uploaded my business card design and applied it to a credit card design template and this has given me an idea of how my cards would look if they were to be printed.

The Business Cards

With the Augmented reality side of my project coming along nicely i thought it would be a good idea to start my business card designs. The trouble with making a business card with  an augmented reality marker on it is that you are very limited to space. You have to devote one side of the card solely to the AR marker so the user has enough room to hold it and the camera can see enough of the marker to work correctly. Then you have to use your remaining side purely for your business information and present it in a clear yet graphical way. For this part of the process i am using Adobe Illustrator and creating everything from scratch.

Here is where i have got to with my preliminary design:

I have kept the whole design quite simple and provided only the key information needed for my clients. I have also kept the colour system quite cool and complimenting so the augmented reality marker really sticks out and is more striking than the rest of the card. This is what will hopefully draw them to my website and gets them interested.

Making Markers

At this point in my project i now have a working model but it is time to take things a step further. I am still using the original Eiffel Tower marker and it would make my augmented reality experience more unique if i had my own unique marker.

To do this i will need to make my own design and convert it into a .pat file. The .pat file is a coded file which knows the rough outline of my design. This file is what will be picked up by the FLARToolKit and in turn will track it for the display of my 3d model.

As i already had an example of a marker in the correct dimensions of 800X800 pixels i decided to use this as a template and then change the graphic in the middle. For this i made a rough version of my company logo. Once it was made i then had to print it out and visit http://flash.tarotaro.org/ar/MarkerGeneratorOnline.swf and photograph it using my webcam. This online program looks at the design and converts the image that it sees into a .pat file. Once i insert that file into my project directory and change the code within flash to accommodate for the name change it should now work.

This image shows the marker before and after the changes.

Fixing Colours

I have now kind of sorted my colouring problems and i think it is a little bit more complex than it needed to be. I have seen many people online with the similar problem but nobody was able to find a fix. Thankfully i came up with a cunning plan.

When colouring in a model in Google SketchUp you have the option of using plain colour or pre-defined textures such as brick and different building materials. If you decide to use the pre-defined textures it works slightly differently. When exporting the model it will create a folder with the texture that you have used and it will save it into the same directory as the .dae file. This folder is now linked to the code within the model and it is set up to find the texture from that folder and then apply it to a certain face of the model.

My cunning plan has worked around this. I have exported my model with different building textures and all i have to do is open up the texture files in photoshop and colour over them with my desired colour. I am sure there must be an easier was of doing this but after hours of searching this was my best idea to a quick fix.

Texture Problems

So i have been testing my model inside of the augmented reality package and it is all working perfectly and appearing over the Eiffel Tower marker but there is a slight problem with the textures and shading. When creating my model in Google SketchUp i gave the object a dark block colour for the top and then shaded the extruded areas with lighter grays. This looked great when i exported it but when i run it through the package i just get a plain black object which doesn’t give you the desired effect. The good news however is that it is working but i must now concentrate on getting the colour corrected.

My Website

When i wrote my statement of what i intended to do for this project i spoke about uploading my finished artefact onto my own website as a demo of my skills. I have now purchased my webspace and got my own domain name. I will be uploading my final work to www.MLDigitalDesign.co.uk even though the full website has not been finished.