Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Web-based multiplex image synthesis for digital signage

1,025 views

Published on

Web-based multiplex image synthesis for digital signagenew.shirai.la
Yoshiki Fujisawa, Hisataka Suzuki, Rex HSIEH, Akihiko Shirai
ShiraiLab, Kanagawa Institute of Technology, Japan
(Presentation in IWAIT2017)
See ExPixel demo: https://playcanv.as/p/sipfSQO4/
ExPixel project details: http://www.shirai.la/project/expixel
publication: http://blog.shirai.la/publications/

Published in: Engineering
  • Be the first to like this

Web-based multiplex image synthesis for digital signage

  1. 1. Web-based multiplex image synthesis for digital signage Yoshiki Fujisawa 1 – Hisataka Suzuki 1 – Rex HSIEH 1 – Akihiko Shirai 1 1ShiraiLab, Kanagawa Institute of Technology, Japan
  2. 2. * Digital signage is used advertising media in the public. 1 * Digital signage shows important information in the public. However it can’t show multiple language at same time. * Digital signage contents must be update. Ø Some supplemental Japanese texts are shown in this presentation to tell the concept of our research… Motivation
  3. 3. History of Multiplex imagery in ShiraiLab * Scritter (Projector-based) * “Scritter” (use 2filters) * “ScritterH” (use 1filter) * “2x3D”(2D+3D Hybrid) * ExPixel (3DFlat panel + Polarized lens) * “ExPixel” * “FPGA” (hardware include ExPixel) * ExField (Flat panel + Lenticular lens) * “ExField” 1st Gen & 2nd Gen: DMD Projectors 3rd Gen: LCD Projector 4th Gen: Flat Panel 5th Gen: Glassless-AR Public Vision Challenge : more useful, easier to use Generation Project Name 2010 2013 2015
  4. 4. ExPixel for digital signage + Manga Generator
  5. 5. ExField / SSSD : Spatial Augmented Reality in the public
  6. 6. * Does public signage allow the glasses? 1 * Is the appearing language readable for the targeted users? If the sign shows multi language, It must be compressed time and /or space for each language. * Digital signage contents must be updated for many terminal devices simultaneously, because its contents are dynamic thing like traffic or stock market. Issue of current multiplex for signage
  7. 7. 5 * The public signage needs 5th gen grassless multiplex imagery technology. * Technology which can show a full screen information for each language without any time and/or space compression. * Technology which can distribute and update multiplex contents simply. Solutions of my idea
  8. 8. Algorithm of ExPixel With a circular polarization filter Contrast compression(1) (2) (3) Inversed gamma correction Even odd selection
  9. 9. Algorithm of ExFiled
  10. 10. 5 * The public signage needs 5th gen grassless multiplex imagery technology. * Technology which can show a full screen information for each language without any time and/or space compression. * Technology which can distribute and update multiplex contents simply. Solutions of my idea
  11. 11. * Develop multiplex image by PlayCanvas. PlayCanvas * PlayCanvas is public web-based game engine. PlayCanvas * It uses JavaScript and 2 GLSL shaders in PlayCanvas JavaScript GLSL 2 implementation Original image PlayCanvas JavaScript GLSL shader GLSL shader Multiplex image
  12. 12. * PlayCanvas is a HTML5/WebGL based game engine * It has GUI editor like Unity * Running on several Internet browser * Contents are published on server * player need an URL to play any contents powered by PlayCanvas What is PlayCanvas? PlayCanvas HTML5/WebGL Unity GUI URL
  13. 13. Implementation of ExPixel (4th Gen) for PlayCanvas * Javascript code takes input images and shader code * Contrast compression, output line-by-line. PlayCanvasJava Script Texture Asset Texture Asset Original Image Shader Asset Shader Asset Fragment Shader Vertex Shader Contrast compression Even odd selection On display
  14. 14. * Mitsubishi : Diamondcrysta RDT234WX-3D Result of Web-based ExPixel (4th Gen) * TOSHIBA : REGZA-42Z8 Naked eye Polarized filter Naked eye Polarized filter
  15. 15. PlayCanvas Java Script Texture Asset Texture Asset Original Image Shader Asset Shader Asset Fragment Shader Vertex Shader Even odd selection On display * Javascript code takes input images and shader code * Fragment shader processing each pixels color, and output Implementation of ExField (5th Gen) for PlayCanvas AAA BBB
  16. 16. Implementation of ExFiled (5th Gen) for PlayCanvas !"#$%"&'() +,&- Pitch H = 567879:; <=9> ?7@AB(5) EFG (HIJK) (1) 'LM N = O 3 − R tan U + ! ×100 ZL"[! ! (2) 'ℎ#,-ℎ"^)[ ∶ 'LM` a b$O,)c")"#(d,f) (b(d,f)) b d,f = c(1)(d,f) (0 ≤ N ≤ 1 & ) c(2) d,f ( 1 & ≤ N ≤ 2 & ) ⋮ c(& − 1)(d,f) ( & − 2 & ≤ N ≤ & − 1 & ) c(&)(d,f) ("'ℎ,#i$-,) (3) ∗ N,O'^#,c")"#1 d,f = c(1)(d,f) JavaScript : (1),(2) Fragment Shader : (3) Please refer paper: Hisataka SUZUKI, Akihiko SHIRAI, Kazuhisa YANAKA, Glassless Augmented Display for Public Signage, The International Journal of Virtual Reality, 2016, 16 (01): pp. 1-6 http://www.ijvr.org/web/search/singleArticle/307
  17. 17. * IODATA : LCD-M4K282XB Result of Web-based ExField (5th Gen) * Alioscopy : Alioscopy 3D HD 24” LV In front of display Left side of display Right side of display In front of display Left side of display Right side of display Angle range 20-30 degrees in horizontal Angle range 2-3 degrees in horizontal
  18. 18. * Show this technology with original signage and 3D display product (Alioscopy) 3D * Original display and poster show multiple images as advertising signage. Public Event : DCEXPO2016 2016/10/27~30 Poster for original signage Left : original signage Right : Alioscopy
  19. 19. Video (URL : https://youtu.be/-cr3g6ejshg)
  20. 20. * ExPixel demo talked in IWAIT2017 Test of Web-based ExPixel URL : https://playcanv.as/p/sipfSQO4/
  21. 21. * ExField demo talked in IWAIT2017 Result of Web-based ExField URL : https:playcanv.as/b/GoQpn3se/
  22. 22. Results ExPixel ExField * Implemented as a browser app which has an united engine both of ExPixel and ExField. Alioscopy * It is possible to show 3 channels for 8 audiences in maximum using Alioscopy’s auto-stereoscopic product in actual condition. URL * It is possible to create user’s contents on PlayCanvas editor, and it can be possible to distribute and update via one URL. (https://playcanv.as/p/sipfSQO4/)
  23. 23. Give us feedback please! [email protected] Web-based multiplex image synthesis for digital signage Yoshiki Fujisawa 1 – Hisataka Suzuki 1 – Rex HSIEH 1 – Akihiko Shirai 1 Affiliation: 1ShiraiLab, Kanagawa Institute of Technology http://www.shirai.la/project/expixel

×