8 October 2015 Invisible Light: a global infotainment community based on augmented reality technologies
Author Affiliations +
Proceedings Volume 9793, Education and Training in Optics and Photonics: ETOP 2015; 979306 (2015) https://doi.org/10.1117/12.2223054
Event: Education and Training in Optics and Photonics: ETOP 2015, 2015, Bordeaux, France
Theoretical details about optics and photonics are not common knowledge nowadays. Physicists are keen to scientifically explain ‘light,’ which has a huge impact on our lives. It is necessary to examine it from multiple perspectives and to make the knowledge accessible to the public in an interdisciplinary, scientifically well-grounded and appealing medial way. To allow an information exchange on a global scale, our project “Invisible Light” establishes a worldwide accessible platform. Its contents will not be created by a single instance, but user-generated, with the help of the global community. The article describes the infotainment portal “Invisible Light,” which stores scientific articles about light and photonics and makes them accessible worldwide. All articles are tagged with geo-coordinates, so they can be clearly identified and localized. A smartphone application is used for visualization, transmitting the information to users in real time by means of an augmented reality application. Scientific information is made accessible for a broad audience and in an attractive manner.



The authors have implemented a project, made possible by network and digital technology, which enables the optics and photonics community to compile a dynamic encyclopedia of optics and photonics. What makes the project unique is that it combines contents with geographical locations, creating in fact not just an encyclopedia but an atlas of optics and photonics. Utilizing the synergies of a database, an app and a website, a global, dynamic and interactive information platform has been established for the optical community. Users do not need to possess expert knowledge of optics and photonics, as the contents are readily accessible. Visitors decide for themselves whether they want to be actively contributing to the information platform; they can also just view the contents posted by other community members. In addition to the teaser view mode, qualified users may post websites themselves and supply further material to the platform. Again, however, this is not obligatory, and even beginners can easily contribute. The contents are accessible via two channels, an interactive portal and a mobile augmented reality application where depending on the individual users’ location, they receive information on their smartphones in real time which is directly related to optics and photonics in their immediate environment. The new information platform thus not only supplies relevant information, but heightens users’ awareness of optics and photonics topics surrounding them. By integrating location-specific data, users are pointed to important events, findings and achievements of optics and photonics in their immediate vicinity, which that they otherwise might not have become aware of.



From the beginning, a major conceptual consideration was the design of the content platform. Innovative web-design concepts were realized, particularly the “responsive web design,” or RWD, which in this context means a grid-based, platform-independent and device-independent design. The implementation phase no longer focuses on ‘pixel perfect’ placements, but on a proportional, dynamic layout which can adapt to the respective available display areas (Fig. 1) as well as to user behavior [1].

Fig. 1:

Responsive Web Design (RWD) grid layout for the Invisible Light project


During the conceptual phase, one template for mobile devices and one for stationary computers were developed to account for the viewing modes of the most common end devices. By dynamically adapting the distribution of the different website elements to the respective devices, the necessary bandwidth can be reduced as well [2]. The design was conceptualized accordingly, starting with the spectral colors, which were incorporated in their different characteristic colors. Otherwise, the visual presentation was mainly based on vectorized and hence scalable contents.



Besides the design conception, the necessary front-end framework was evaluated to deliver all needed functionalities. The software requirement – web-based, platform- and end-device independent – was met by the Bootstrap CSS framework (a Twitter open source project). Based on CSS3 and HTML5 web technologies, Bootstrap facilitates platform-independent website by means of so-called Media Queries, which allow content aggregation to adapt to the various different end devices. The four conditions are detailed in short below:


The afore-mentioned CSS (Cascading Style Sheets) commands symbolize the main elements of RWD [3]. They make it possible to correctly identify smartphones, tablets, notebooks and stationary computers, and supply them with the most suitable layout and typesetting. By providing consistent structural guidelines (Document Object Model), user actions can be performed across devices. The dynamism involved is client-based, not server-based, with the JavaScript language and the JQuery extension providing the most essential tools for the interactive platform realization [4].

A user-centered internet platform without a database is hardly feasible anymore. Hence, a consistent framework for storing user data and marker information had to be established. This objective is met by the Apache Server software, which is capable of processing both the MySQL database system and PHP documents. MySQL was implemented for long-term data storage, while the PHP scripting language is used for the communication between server and user [5].



Three different user categories are available on the interactive platform. When accessing the website for the first time, users have limited interaction possibilities, i.e. they can only read contents. Following successful registration and authentication, they can deposit contents themselves and make them accessible to the platform’s community. The third category of users are the administrators. The administrator group must verify and authorize all deposited contents, which prohibits any harmful, irrelevant or commercial content from reaching the platform at any time.

As mentioned above, users first have to undergo registration and authentication before they can join the community and place a marker in the system. After submitting their user data, they receive an automated message to the stated email account, verifying their authenticity. They can then post their own contents, which are positioned by a geo-algorithm. Following positioning, users can add information to the marker; besides a title and short description, a picture and links to relevant websites can be added. The importance of the picture should be emphasized in this context, as it can communicate contents across possible language barriers within the community.



Besides the interactive internet platform, an Augmented Reality (AR) application was developed which integrates additional information into a real image [6]- [9]. To visualize the information the respective end device must have a camera and be trackable via GPS, WiFi or GSM localization [10]. Only if the system is able to locate the user’s position, additional information can be displayed. In terms of the hardware, almost all mobile end-devices meet these requirements, so that compatibility should be achievable. AR applications basically all work in the same way: Through the implemented camera function, a real image is shown on the display [11] -[13]. Coupled with the location data, additional information is supplied which is relevant to the user’s position (Fig. 2). For the AR application created for the International Year of Light 2015, the Wikitude framework was used, which delivers all the necessary functions and is freely available for academic purposes. The web technologies used – CSS3, HTML5 and JavaScript – are sufficient for the implementation [14]. Unlike so-called web apps, the AR application is not merely a display software, but combines device-specific hardware components with the software logic, which in turn is coupled directly with the user interaction. Thus, the Wikitude SDK can be regarded as a kind of interpreter, facilitating human-machine interaction.

Fig. 2:

Live example at the opening ceremony of the IYL2015 in Paris


The AR app for the International Year of Light 2015 basically consists of three different screen contents. When starting the app, the camera mode is activated. The program then verifies whether the user’s location can be identified and internet connection can be established. If both are the case, the app sends a request to the server, reporting the user’s current location and the search radius. Based on this information, the database is searched for relevant entries, which are then transmitted to the mobile end device, see Fig. 3. This preselection is necessary so that only those database entries have to be transmitted which directly relate to the user’s current location.

Fig. 3:

Display types of the marker information


The transmitted data are processed on the respective end device. The end user can opt for the type of visualization of his or her choice – the marker information can be displayed in a real image, in list format, or on a map. The standardized communication between the server and the end device is provided by an API interface, which delivers the marker data as a JSON object [15]. This object contains all the necessary information for the display in the AR application.


After the beta phase was successfully completed, the AR-APP was released to the public. Already, 985 markers have been placed worldwide (Fig. 4), which can be displayed on the internet platform as well as with the AR app. What is more, Wikitude lists our Invisible Light Project AR app on their website as a showcase example of implementing their software [16].

Fig. 4:

The world of optics and photonics at a glance




Both the AR application and the interactive information portal are opening up the exciting world of optics and photonics to a broader audience. For the first time, interested individuals around the globe can actively contribute to the collection of information in the field of optics and photonics without any special access requirements. All people, regardless of their origin or location, can explore information about optics and photonics in their immediate environment, or make it available for others. To be sure, the community depends on the active contributions of its members; with every new contributor, the information value of the platform will rise continuously. More and more relevant events and locations will be recorded, paving the way for 4.0-based education and trainings in the field of optics and photonics.



Barker, T. [High Performance Responsive Design: Building Faster Sites Across Devices], O’Reilly & Associates, Sebastopol, (2015)Google Scholar


Fielding, J. [Beginning Responsive Web Design with HTML5 and CSS3], Apress New York, (2014) https://doi.org/10.1007/978-1-4302-6695-2Google Scholar


Duckett, J. [The Principles and Processes of Interactive Design], John Wiley & Sons, Indianapolis, (2014)Google Scholar


Steane, J. [JavaScript and JQuery: Interactive Front-End Web Development], Bloomsbury Publishing, London / New York, (2014)Google Scholar


Nixon, R. [Learning PHP, MySQL, JavaScript, CSS & HTML5: A Step-by-Step Guide to Creating Dynamic Websites], O’Reilly & Associates, Sebastopol, (2014)Google Scholar


Dorner R., [Virtual und Augmented Reality (VR/AR): Grundlagen und Methoden der Virtuellen und Augmentierten Realität], Springer Vieweg, Wiesbaden, (2014)Google Scholar


Ullmann A., [Augmented Reality als Medium strategischer medialer Kommunikation], Grin Verlag GmbH, München, Ravensburg, (2014)Google Scholar


Hemmerling M., [Augmented Reality. Mensch, Raum und Virtualität], Wilhelm Fink Verlag, München, (2014)Google Scholar


Preuß S., [Augmented Reality: Hype oder zukunftsweisende Technik?], Grin Verlag GmbH, München / Ravensburg, (2014)Google Scholar


Holdener, A. [HTML5 Geolocation], O’Reilly & Associates, Sebastopol, (2011)Google Scholar


Grubert J., Grasset Ra., [Augmented Reality for Android Application Development], Packt Publishing, Birmingham, (2013)Google Scholar


Haller M., Billinghurst M., Thomas H. B., [Emerging Technologies of Augmented Reality: Interfaces and Design], IGI Publishing, Hershey / Pennsylvania, (2006)Google Scholar


Craig A., [Understanding Augmented Reality: Concepts and Applications], Morgan Kaufmann, Waltham, (2013)Google Scholar


Wikitude GmbH, “Wikitude SDK”, http://www.wikitude.com/products/wikitude-sdk/ (4 May 2015)Google Scholar


Smith, B. [Beginning JSON], Apress, New York, (2015) https://doi.org/10.1007/978-1-4842-0202-9Google Scholar


Wikitude GmbH, “Invisible Light Project – Wikitude in the International Year of Light 2015”, http://www.wikitude.com/showcase/invisible-light-project-wikitude-hs-offenburg-international-year-light-2015/ (4 May 2015)Google Scholar

© (2015) COPYRIGHT Society of Photo-Optical Instrumentation Engineers (SPIE). Downloading of the abstract is permitted for personal use only.
Kai Israel, Kai Israel, Peter Wozniak, Peter Wozniak, Oliver Vauderwange, Oliver Vauderwange, Dan Curticapean, Dan Curticapean, } "Invisible Light: a global infotainment community based on augmented reality technologies", Proc. SPIE 9793, Education and Training in Optics and Photonics: ETOP 2015, 979306 (8 October 2015); doi: 10.1117/12.2223054; https://doi.org/10.1117/12.2223054


Perform light and optic experiments in Augmented Reality
Proceedings of SPIE (October 07 2015)
A blended learning concept for an engineering course in the...
Proceedings of SPIE (September 26 2016)
Q-PIT: a populated information terrain
Proceedings of SPIE (March 07 1996)
Mobile multimedia understanding applications: an overview
Proceedings of SPIE (February 07 2011)
Text-based search of TV news stories
Proceedings of SPIE (October 31 1996)

Back to Top