![Page 1: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/1.jpg)
Web-based multiplex image synthesisfor digital signage
Yoshiki Fujisawa 1 – Hisataka Suzuki 1 – Rex HSIEH 1 – Akihiko Shirai 1
1ShiraiLab, Kanagawa Institute of Technology, Japan
![Page 2: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/2.jpg)
ÖËÐèȼÚî˨��X�¢0"£�¡�M�µ¡�´
* Digital signage is used advertising media in the public.
ȼÚî˨��¦~m¥7'¸hV�¡�´���A¦1 §ps��hV¢�¥�* Digital signage shows important information in the public.
However it can’t show multiple language at same time.
ÖËÐèȼÚî˧ÇìÕìÔ¨B>�5m¢�´
* Digital signage contents must be update.
Ø Some supplemental Japanese texts are shown in this presentation to tell the concept of our research…
Motivation
![Page 3: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/3.jpg)
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-ARPublic Vision
Challenge : more useful, easier to use
Generation Project Name2010
2013
2015
![Page 4: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/4.jpg)
ExPixel for digital signage + Manga Generator
![Page 5: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/5.jpg)
ExField / SSSD : Spatial Augmented Reality in the public
![Page 6: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/6.jpg)
)~�:g¨{��¡�¡�´��ÜßçÓÃ!�ȼÚî˦¨S�¨5mö
* Does public signage allow the glasses?
ȼÚî˧hV�¡�´7'�7'��a�t®´ps¢�´§�ö)ps¸�A¦hV�±�£�´£�1 ��³§ps§A�°X�¸K.��´* 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.
ÖËÐèȼÚî˧ÇìÕìÔ¨�y7'°H�§±�¦�Q¢���³�)=§È¼ÚîËZF¦�A¦ÇìÕìÔB>¸}��´5m��´�
* 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
![Page 7: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/7.jpg)
ÜßçÓÃ!�ȼÚî˦¨[5�§jS)~�@�:g�E3�µ´* The public signage needs 5th gen grassless multiplex imagery technology.
hV¿çº¸K²��¦�A¦�µ�µ§ps¸ÞèÌÃçîì¢hV�´�£¢A�£X�¸K.��¥�:g
* Technology which can show a full screen information for each language without any time and/or space compression.
)~�ȼÚî˧ÇìÕìÔ§ÚÓ×ëîÃB>¸9w¦f�:g
* Technology which can distribute and update multiplex contents simply.
Solutions of my idea
![Page 8: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/8.jpg)
Algorithm of ExPixel
With a circular polarization filter
Contrast compression(1)
(2)
(3)
Inversed gamma correction
Even odd selection
![Page 9: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/9.jpg)
Algorithm of ExFiled
![Page 10: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/10.jpg)
ÜßçÓÃ!�ȼÚî˦¨[5�§jS)~�@�:g�E3�µ´* The public signage needs 5th gen grassless multiplex imagery technology.
hV¿çº¸K²��¦�A¦�µ�µ§ps¸ÞèÌÃçîì¢hV�´�£¢A�£X�¸K.��¥�:g
* Technology which can show a full screen information for each language without any time and/or space compression.
)~�ȼÚî˧ÇìÕìÔ§ÚÓ×ëîÃB>¸9w¦f�:g
* Technology which can distribute and update multiplex contents simply.
Solutions of my idea
![Page 11: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/11.jpg)
* Develop multiplex image by PlayCanvas.)~�@�§+i¦¨PlayCanvas¸�M�´
* PlayCanvas is public web-based game engine.
PlayCanvas¨�2§½¾ßáîÌÆîâ¿ìËì¢�´
* It uses JavaScript and 2 GLSL shadersin PlayCanvas
JavaScript£GLSLʾîѸ2 �M�´
implementation
Original image
PlayCanvas
JavaScript GLSL shader
GLSL shader
Multiplex image
![Page 12: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/12.jpg)
* 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¿Ö»Ðî��´
I�¥¼ìÐîÚÓ×ßæ½Éî¢���´
ÇìÕìÔ¨ÈîÛî¸��¡���µ´
URL��µ©��«¬�
![Page 13: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/13.jpg)
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
![Page 14: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/14.jpg)
* Mitsubishi : Diamondcrysta RDT234WX-3D
Result of Web-based ExPixel (4th Gen)
* TOSHIBA : REGZA-42Z8 Naked eye Polarized filter
Naked eye Polarized filter
![Page 15: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/15.jpg)
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
![Page 16: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/16.jpg)
Implementation of ExFiled (5th Gen)for PlayCanvas
!"#$%"&'()+,&-Pitch H = 567879:;<=9>?7@AB(5)
EFG(HIJK)(1)
'LM N =
O3 −
Rtan 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-6http://www.ijvr.org/web/search/singleArticle/307
![Page 17: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/17.jpg)
* 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
![Page 18: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/18.jpg)
* Show this technology with original signage and 3D display product (Alioscopy) ÀçËÙèȼÚîË£3Dk#¸¯��¡/V¸f��* Original display and poster show multiple images as advertising signage.
Public Event : DCEXPO20162016/10/27~30
Poster for original signage Left : original signage Right : Alioscopy
![Page 19: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/19.jpg)
Video (URL : https://youtu.be/-cr3g6ejshg)
![Page 20: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/20.jpg)
* ExPixel demo talked in IWAIT2017
Test of Web-based ExPixel
URL : https://playcanv.as/p/sipfSQO4/
![Page 21: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/21.jpg)
* ExField demo talked in IWAIT2017
Result of Web-based ExField
URL : https:playcanv.as/b/GoQpn3se/
![Page 22: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/22.jpg)
Results
[ó�ExPixel£[ô�ExField¸�y§¿ìËì¢ßæ½É�¦+i��* Implemented as a browser app which has an united engine both of ExPixel and ExField.
AlioscopyWk§Y�Ö»Ìàé¼k#¢C*òÒäìÚèõ §hV��b£¥��* It is possible to show 3 channels for 8 audiences in maximum using Alioscopy’s
auto-stereoscopic product in actual condition.
ßæ½É�§¿Ö»Ðî¢ÇìÕìÔ¸_���URL¸}�íB>��b¦¥��* 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/)
![Page 23: Web-based multiplex image synthesis for digital signage](https://reader033.vdocuments.net/reader033/viewer/2022052915/587ea3f21a28ab2a4a8b63cf/html5/thumbnails/23.jpg)
Give us feedback [email protected]
Web-based multiplex image synthesis fordigital 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