SlideShare ist ein Scribd-Unternehmen logo
1 von 18
HTML



                      Lead Programmer
           songinnight@big4games.com


       1
1.

2.                    ,

3.   HTML

4.   HTML

5.

6.   Hybrid

7.            HTML5

8.

               2
HTML                 HTML
                                              Flash




2010                    2011 NetZone

2011 NetZone            2011.5 Naver
                                                           .
2011 PICTOSOFT          2011.6 Cyworld
                                                  2012.5
2011.11 Naver Playnet   2011.6 Yahoo Mobage

2012 Yahoo Mobage       2011.11     2


                                         3
34    10

          PC   Mobile

Mobile Game 64%




*                   ,
     20           HTML


                         4
Flash                        Native




Unity3D        Server            Unity3D




   HTML                         Hybrid




           *
                     HTML   .




                 5
HTML


                   Platform



                  Windows


            1/n
                   Mac


       HTML

                  Android




                    iOS




        6
HTML

                                                               HTML
                                        jpg, gif -           , png - IE6                24bit            X



    2D Move, Scaling                 Scaling                                                                 .

                                                              -moz-transform: scaleX(-1)
                                                             -webkit-transform: scaleX(-1)

          2D           Flip                                    -o-transform: scaleX(-1)
                                                                transform: scaleX(-1)
                                                                filter: fliph !important
                                                              -ms-filter: 'fliph' !important




           Image Tiling                          background-image                               .


                                     woff, eot                                    .                 .(           )

                                                                    opacity: 0.6
               Opacity                  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"
                                                             filter: alpha(opacity=60)



2D Rotation                                                 CSS3


                                         2D                           .
                                CSS3                              .
*              W3C                     . http://www.w3schools.com/
                                 7
HTML




,


           8
HTML




       9
HTML




Javascript   Isometric        /


                         10
,

W3C     IE 6            IE 7   IE 9




Nate




Naver




                   11
IE 6.0
24bit PNG                             . (8bit            )
Javascript               png
    ,                                 .

IE 7.0
                               DOM                   .
➔ IE7        DOM append                              DOM          .

IE 9.0
Google Opensocial                               12152 Network Error
➔        .                                                   .

Firefox        background-position-x, y
➔              x, y                        .

                      position: absolute


                                                12
HYBRID APPLICATION

Market
                     iOS / Android
                      Native App

                 Local Image Resource




                  Webview HTML
                (Localhost     )




                                        Game Server
                     iframe HTML



                     iTunes, Android                      .
    , jQueryMobile                                    .

                                  13
HTML5




          http://m.mafiawars.com                   http://www.pirateslovedaisies.com




Adobe                                 HTML5                                               .
Flash                             Web Socket        .
*                                           .
OpenGL 3D         ,
                      CPU          ➔ Action
HTML5 Canvas (Javascript)                   Native Application                        .

                                      14
IE 6, 7     .




2011   9                   15%




                 CPU




                                 15
MS                 IE6

http://www.ie6countdown.com




                              16
PC              Mobile



        Flash         Native App.

RPG    Unity3D       Unity3D Mobile




        HTML           Web App.
TRPG




                17
.

     .




18

Weitere ähnliche Inhalte

Ähnlich wie [SSS 2nd] 빅포게임즈 HTML 유무선연동

Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionBelen Barros Pena
 
HTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersHTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersSascha Corti
 
Rapid and Reliable Developing with HTML5 & GWT
Rapid and Reliable Developing with HTML5 & GWTRapid and Reliable Developing with HTML5 & GWT
Rapid and Reliable Developing with HTML5 & GWTManuel Carrasco Moñino
 
Change by HTML5
Change by HTML5Change by HTML5
Change by HTML5dynamis
 
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web SimulatorOSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web SimulatorGail Frederick
 
Top 10 Web and HTML5 Predictions for 2013
Top 10 Web and HTML5 Predictions for 2013Top 10 Web and HTML5 Predictions for 2013
Top 10 Web and HTML5 Predictions for 2013Jonathan Jeon
 
阅读类Web应用前端技术探索
阅读类Web应用前端技术探索阅读类Web应用前端技术探索
阅读类Web应用前端技术探索taobao.com
 
阅读类 Web 应用前端技术探索
阅读类 Web 应用前端技术探索阅读类 Web 应用前端技术探索
阅读类 Web 应用前端技术探索Yan Shi
 
Mobile applications for SharePoint using HTML5
Mobile applications for SharePoint using HTML5Mobile applications for SharePoint using HTML5
Mobile applications for SharePoint using HTML5Christian Heindel
 
soft-shake.ch - Introduction to HTML5
soft-shake.ch - Introduction to HTML5soft-shake.ch - Introduction to HTML5
soft-shake.ch - Introduction to HTML5soft-shake.ch
 
SnapyX
SnapyXSnapyX
SnapyXekino
 
Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3Pravasini Sahoo
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1James Pearce
 
Apache Flex and the imperfect Web
Apache Flex and the imperfect WebApache Flex and the imperfect Web
Apache Flex and the imperfect Webmasuland
 
OSCOM 4: Managing Beautiful Websites with Cocoon
OSCOM 4: Managing Beautiful Websites with CocoonOSCOM 4: Managing Beautiful Websites with Cocoon
OSCOM 4: Managing Beautiful Websites with Cocoonnobby
 

Ähnlich wie [SSS 2nd] 빅포게임즈 HTML 유무선연동 (20)

Fragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fictionFragmentation in mobile design: fact or fiction
Fragmentation in mobile design: fact or fiction
 
HTML5 Intoduction for Web Developers
HTML5 Intoduction for Web DevelopersHTML5 Intoduction for Web Developers
HTML5 Intoduction for Web Developers
 
What is HTML5
What is HTML5What is HTML5
What is HTML5
 
Rapid and Reliable Developing with HTML5 & GWT
Rapid and Reliable Developing with HTML5 & GWTRapid and Reliable Developing with HTML5 & GWT
Rapid and Reliable Developing with HTML5 & GWT
 
Html5 tx - preso
Html5 tx - presoHtml5 tx - preso
Html5 tx - preso
 
Echo HTML5
Echo HTML5Echo HTML5
Echo HTML5
 
Change by HTML5
Change by HTML5Change by HTML5
Change by HTML5
 
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web SimulatorOSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator
OSCON 2012: Design and Debug HTML5 Apps for Devices with RIB and Web Simulator
 
Top 10 Web and HTML5 Predictions for 2013
Top 10 Web and HTML5 Predictions for 2013Top 10 Web and HTML5 Predictions for 2013
Top 10 Web and HTML5 Predictions for 2013
 
阅读类Web应用前端技术探索
阅读类Web应用前端技术探索阅读类Web应用前端技术探索
阅读类Web应用前端技术探索
 
阅读类 Web 应用前端技术探索
阅读类 Web 应用前端技术探索阅读类 Web 应用前端技术探索
阅读类 Web 应用前端技术探索
 
Mobile applications for SharePoint using HTML5
Mobile applications for SharePoint using HTML5Mobile applications for SharePoint using HTML5
Mobile applications for SharePoint using HTML5
 
soft-shake.ch - Introduction to HTML5
soft-shake.ch - Introduction to HTML5soft-shake.ch - Introduction to HTML5
soft-shake.ch - Introduction to HTML5
 
SnapyX
SnapyXSnapyX
SnapyX
 
SnapyX - ParisJS
SnapyX - ParisJSSnapyX - ParisJS
SnapyX - ParisJS
 
Pole web pp
Pole web ppPole web pp
Pole web pp
 
Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1
 
Apache Flex and the imperfect Web
Apache Flex and the imperfect WebApache Flex and the imperfect Web
Apache Flex and the imperfect Web
 
OSCOM 4: Managing Beautiful Websites with Cocoon
OSCOM 4: Managing Beautiful Websites with CocoonOSCOM 4: Managing Beautiful Websites with Cocoon
OSCOM 4: Managing Beautiful Websites with Cocoon
 

Mehr von GAMENEXT Works

MAX SUMMIT 2015 SEOUL INTRO (ENG)
MAX SUMMIT 2015 SEOUL INTRO (ENG)MAX SUMMIT 2015 SEOUL INTRO (ENG)
MAX SUMMIT 2015 SEOUL INTRO (ENG)GAMENEXT Works
 
MAX SUMMIT 2015 행사 소개서 (1차)
MAX SUMMIT 2015 행사 소개서 (1차)MAX SUMMIT 2015 행사 소개서 (1차)
MAX SUMMIT 2015 행사 소개서 (1차)GAMENEXT Works
 
[구인] 크리에이티브 디자이너 -
[구인] 크리에이티브 디자이너 - [구인] 크리에이티브 디자이너 -
[구인] 크리에이티브 디자이너 - GAMENEXT Works
 
TREENOD 구인 공고 특집편 201507
TREENOD 구인 공고 특집편 201507TREENOD 구인 공고 특집편 201507
TREENOD 구인 공고 특집편 201507GAMENEXT Works
 
GAMENEXT-SUMMIT 2015 티저(KR)
GAMENEXT-SUMMIT 2015 티저(KR)GAMENEXT-SUMMIT 2015 티저(KR)
GAMENEXT-SUMMIT 2015 티저(KR)GAMENEXT Works
 
게임넥스트웍스, 헤드헌터 비지니스 개시
게임넥스트웍스, 헤드헌터 비지니스 개시게임넥스트웍스, 헤드헌터 비지니스 개시
게임넥스트웍스, 헤드헌터 비지니스 개시GAMENEXT Works
 
[판교] G-HUB 게임커넥트 행사 소개서
[판교] G-HUB 게임커넥트 행사 소개서[판교] G-HUB 게임커넥트 행사 소개서
[판교] G-HUB 게임커넥트 행사 소개서GAMENEXT Works
 
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차GAMENEXT Works
 
Demo ver. Korean Mobile Gaming Industry Book
Demo ver. Korean Mobile Gaming Industry BookDemo ver. Korean Mobile Gaming Industry Book
Demo ver. Korean Mobile Gaming Industry BookGAMENEXT Works
 
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로GAMENEXT Works
 
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개GAMENEXT Works
 
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)GAMENEXT Works
 
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅 [GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅 GAMENEXT Works
 
[GAMENEXT] 중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)
[GAMENEXT]  중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)[GAMENEXT]  중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)
[GAMENEXT] 중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)GAMENEXT Works
 
[GAMENEXT] 스타트업 소개 - 인앱인
[GAMENEXT] 스타트업 소개 - 인앱인 [GAMENEXT] 스타트업 소개 - 인앱인
[GAMENEXT] 스타트업 소개 - 인앱인 GAMENEXT Works
 
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...GAMENEXT Works
 
[GAMENEXT] Five mantras for l10 (LatisGlboal)
[GAMENEXT] Five mantras for l10 (LatisGlboal)[GAMENEXT] Five mantras for l10 (LatisGlboal)
[GAMENEXT] Five mantras for l10 (LatisGlboal)GAMENEXT Works
 
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...GAMENEXT Works
 
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)GAMENEXT Works
 
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)GAMENEXT Works
 

Mehr von GAMENEXT Works (20)

MAX SUMMIT 2015 SEOUL INTRO (ENG)
MAX SUMMIT 2015 SEOUL INTRO (ENG)MAX SUMMIT 2015 SEOUL INTRO (ENG)
MAX SUMMIT 2015 SEOUL INTRO (ENG)
 
MAX SUMMIT 2015 행사 소개서 (1차)
MAX SUMMIT 2015 행사 소개서 (1차)MAX SUMMIT 2015 행사 소개서 (1차)
MAX SUMMIT 2015 행사 소개서 (1차)
 
[구인] 크리에이티브 디자이너 -
[구인] 크리에이티브 디자이너 - [구인] 크리에이티브 디자이너 -
[구인] 크리에이티브 디자이너 -
 
TREENOD 구인 공고 특집편 201507
TREENOD 구인 공고 특집편 201507TREENOD 구인 공고 특집편 201507
TREENOD 구인 공고 특집편 201507
 
GAMENEXT-SUMMIT 2015 티저(KR)
GAMENEXT-SUMMIT 2015 티저(KR)GAMENEXT-SUMMIT 2015 티저(KR)
GAMENEXT-SUMMIT 2015 티저(KR)
 
게임넥스트웍스, 헤드헌터 비지니스 개시
게임넥스트웍스, 헤드헌터 비지니스 개시게임넥스트웍스, 헤드헌터 비지니스 개시
게임넥스트웍스, 헤드헌터 비지니스 개시
 
[판교] G-HUB 게임커넥트 행사 소개서
[판교] G-HUB 게임커넥트 행사 소개서[판교] G-HUB 게임커넥트 행사 소개서
[판교] G-HUB 게임커넥트 행사 소개서
 
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차
2014 GAME-NEXT SUMMIT BOOK - 게임업계일람 2014년 1차
 
Demo ver. Korean Mobile Gaming Industry Book
Demo ver. Korean Mobile Gaming Industry BookDemo ver. Korean Mobile Gaming Industry Book
Demo ver. Korean Mobile Gaming Industry Book
 
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로
모바일 게임의 이해 : 해외 시장 현황 - 일본과 중국을 중심으로
 
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개
모바일 게임의 이해 : 생존을 넘어서 PART 1,2 선행 공개
 
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)
[GAMENEXT] 중국에서의 게임 퍼블리셔 제안 (Lacheers)
 
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅 [GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅
[GAMENEXT] 사전등록대행앱의등장과활용 - 코어게이머확보를위한프리런치(Pre-Launch)마케팅
 
[GAMENEXT] 중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)
[GAMENEXT]  중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)[GAMENEXT]  중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)
[GAMENEXT] 중국모바일네트워크소개및한국게임중국진출사례분석 (JAMOJOY)
 
[GAMENEXT] 스타트업 소개 - 인앱인
[GAMENEXT] 스타트업 소개 - 인앱인 [GAMENEXT] 스타트업 소개 - 인앱인
[GAMENEXT] 스타트업 소개 - 인앱인
 
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
 
[GAMENEXT] Five mantras for l10 (LatisGlboal)
[GAMENEXT] Five mantras for l10 (LatisGlboal)[GAMENEXT] Five mantras for l10 (LatisGlboal)
[GAMENEXT] Five mantras for l10 (LatisGlboal)
 
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
[GAMENEXT] What you don’t know CAN hurt you: Understanding the true meaning o...
 
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)
[GAMENEXT] 게임 스타트업을 위한 영업 비밀 (김윤명)
 
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)
[GAMENEXT] The Rising Stars “Mobile Market Trend 2014" (APPSASIA)
 

Kürzlich hochgeladen

"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piececharlottematthew16
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationSlibray Presentation
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 

Kürzlich hochgeladen (20)

"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piece
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
Connect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck PresentationConnect Wave/ connectwave Pitch Deck Presentation
Connect Wave/ connectwave Pitch Deck Presentation
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 

[SSS 2nd] 빅포게임즈 HTML 유무선연동

  • 1. HTML Lead Programmer songinnight@big4games.com 1
  • 2. 1. 2. , 3. HTML 4. HTML 5. 6. Hybrid 7. HTML5 8. 2
  • 3. HTML HTML Flash 2010 2011 NetZone 2011 NetZone 2011.5 Naver . 2011 PICTOSOFT 2011.6 Cyworld 2012.5 2011.11 Naver Playnet 2011.6 Yahoo Mobage 2012 Yahoo Mobage 2011.11 2 3
  • 4. 34 10 PC Mobile Mobile Game 64% * , 20 HTML 4
  • 5. Flash Native Unity3D Server Unity3D HTML Hybrid * HTML . 5
  • 6. HTML Platform Windows 1/n Mac HTML Android iOS 6
  • 7. HTML HTML jpg, gif - , png - IE6 24bit X 2D Move, Scaling Scaling . -moz-transform: scaleX(-1) -webkit-transform: scaleX(-1) 2D Flip -o-transform: scaleX(-1) transform: scaleX(-1) filter: fliph !important -ms-filter: 'fliph' !important Image Tiling background-image . woff, eot . .( ) opacity: 0.6 Opacity -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)" filter: alpha(opacity=60) 2D Rotation CSS3 2D . CSS3 . * W3C . http://www.w3schools.com/ 7
  • 8. HTML , 8
  • 9. HTML 9
  • 10. HTML Javascript Isometric / 10
  • 11. , W3C IE 6 IE 7 IE 9 Nate Naver 11
  • 12. IE 6.0 24bit PNG . (8bit ) Javascript png , . IE 7.0 DOM . ➔ IE7 DOM append DOM . IE 9.0 Google Opensocial 12152 Network Error ➔ . . Firefox background-position-x, y ➔ x, y . position: absolute 12
  • 13. HYBRID APPLICATION Market iOS / Android Native App Local Image Resource Webview HTML (Localhost ) Game Server iframe HTML iTunes, Android . , jQueryMobile . 13
  • 14. HTML5 http://m.mafiawars.com http://www.pirateslovedaisies.com Adobe HTML5 . Flash Web Socket . * . OpenGL 3D , CPU ➔ Action HTML5 Canvas (Javascript) Native Application . 14
  • 15. IE 6, 7 . 2011 9 15% CPU 15
  • 16. MS IE6 http://www.ie6countdown.com 16
  • 17. PC Mobile Flash Native App. RPG Unity3D Unity3D Mobile HTML Web App. TRPG 17
  • 18. . . 18