Html5 android ios flash

Html5 android ios flash

Платформа игр Одноклассников поддерживает возможность интеграции и запуска HTML5-приложений на всех мобильных платформах, доступных в нашей социальной сети — мобильный веб, нативные приложения Одноклассников на платформах Android и IOS.

Создание и настройка приложения

Для подключения поддержки вашей игры на мобильных платформах необходимо его правильно настроить. Для этого надо создать новое или отредактировать уже существующее веб-приложение, подключив у него платформу HTML (Mobile).

Если у вас вдруг всё еще нет приложения, то создать его можно по этой инструкции.

После создания приложения, либо если оно у вас уже есть, остается лишь включить платформу следующим образом:

Интеграция с Одноклассниками

После того, как вы успешно настроили приложение, оно будет доступно по прямой ссылке вида https://m.ok.ru/game/gameId.

ID приложения можно получить из письма, которое приходило вам после создания приложения. В нём так же содержаться публичный и секретный ключи приложения, необходимые для взаимодействия с API Одноклассников. То есть письмо будет примерно таким:

Ваше приложение НАЗВАНИЕ ПРИЛОЖЕНИЯ успешно зарегистрировано на Одноклассниках.

Application ID: 1234567890. — id приложения, который вы можете использовать для идентификации приложения и досупа к нему по ссылке

Публичный ключ приложения: CBANANNANANANANA. — публичный ключ приложения, который используется для взаимодействия с API

Секретный ключ приложения: ABCDE1234567890ABCDE12345. секретный ключ приложения, который используется для взаимодействия с API. Никому не давайте его

Ссылка на приложение: https://ok.ru/game/1234567890 — ссылка на приложение на Одноклассниках. Для доступа к мобильной версии используйте домен m.ok.ru

При открытии вашего приложения на мобильной версии Одноклассников, либо в наших мобильных приложениях, оно будет открываться по URL, который указан в настройках приложения. Кроме это в URL будет передаваться ряд параметров, идентифицирующих пользователя, тип сессии и источник перехода.

Полный список параметров вы можете найти здесь.

Чтобы определить, что игра была открыта на мобильной платформе, передается особый параметр mob=true.

Подключение SDK

Для реализации взаимодействия с API Одноклассников со стороны HTML5-приложения необходимо использовать мультиплатформенное JS SDK.

Возможности API и SDK

После подключения JS SDK вы можете делать следующее:

• делать записи в ленту пользователя с помощью виджета публикации;
• приглашать/слать нотификации в игру с помощью виджета приглашения в игру;
• вызывать REST-методы.

Примеры приложений, которые реализуют это функционал:

• приложение, реализующее вызов REST-API доступно по ссылке;
• приложение, реализующее механики инвайтов в игру и создания записей в ленту пользователей доступно здесь

Платежная система и монетизация

Для платформы Instant Games предусмотрено следующие возможности монетизации игры:

Для каждого из способов монетизации вы можете посмотреть примеры приложений:

• приложение с примером проведения платежа вы можете посмотреть здесь;
• приложение с примером показа рекламы располагается тут.

Для корректной работы платежной системы в настройках игры необходимо указать callback url для обработки платежей

Тестирование приложения

В любое время вы можете проверить, как хорошо работает ваше приложение.

Изначально оно доступно супервизору приложения (пользователь, создавший приложение на Одноклассниках). Для того, чтобы к приложению мог получить доступ другой пользователь, надо выполнить два простых шага:

• пользователь, которому предоставляется доступ к приложению, должен принять права разработчика;
• супервизор приложения должен добавить этого пользователя в список разработчиков приложения.

После этого пользователь должен иметь доступ к игре по прямой ссылка вида https://m.ok.ru/game/gameId. Эту ссылку можно открыть как в мобильном браузере (тогда приложение откроется на мобильной версии Одноклассников), так и внутри приложения Одноклассников на плафтормах Android и IOS.

Также для платформы Android все ваши игры с платформой MOBILE_HTML будут показываться в списке ваших игр в разделе игр. Но обратите внимание, что:

• вы должны быть разработчиком игры;
• у игры должна быть выбрана платформа MOBILE_HTML в настройках;
• для появления раздела моих игр вы должны запустить как минимум одну игру на мобильных платформах ОК.

Отладка приложения

Независимо от платформы, на которой запускается ваше приложение, у вас остается возможность доступа к режиму отладки в браузере.

Отладка на iOS

Наиболее распространенными способами запуска приложения на платформе iOS являются:

• запуск в Safari на мобильной версии Одноклассников — m.ok.ru;
• запуск в Safari через нативное приложение Одноклассников на платформе iOS.

В любом случае вы можете использовать режим отладки в Safari для отладки вашего приложения.

Инструкция по подключению режима удалённой отладки доступна по ссылке — safari remote inspector

Отладка на Android

Наиболее распространенными способами запуска приложения на платформе Android являются:

• запуск в Chrome на мобильной версии Одноклассников — m.ok.ru;
• запуск в Android Webview через нативное приложение Одноклассников на платформе Android.

И в том, и в другом случае для отладки можно использовать режим удаленной отладки в Chrome — android remote debugging

Обратите внимание, что в случае с запуском в Android Webview вам надо:

• запросить возможность дебага для вашей игры, написав заявку на почту api-support@ok.ru;
• убедиться, что версия ОС Android на устройстве — 4.4 и выше.

Требования к приложениям

Прежде чем разрабатывать приложение, ознакомьтесь, пожалуйста, с общими требованиями к играм на Одноклассниках: требования к играм

В дополнение к общим требованиям у HTML5-игр есть ряд характерных только для них требований:

• быть играбельным (не тормозить) на телефонах iPhone 5s и Nexus 5;
• корректно работать на современных веб браузерах и на мобильных браузерах операционных систем Android и iOS;
• На всех неподдерживаемых браузерах игра должна показывать заглушку с просьбой обновиться до последней версии текущего браузера или установить другой современный браузер.

Подробнее с требованиями вы можете ознакомиться в нашем чеклисте для мобильных приложений.

Модерация

Когда ваше приложение готово к публикации на Одноклассниках (разработка завершена и приложение удовлетворяет всем требования платформы), выберите приложение в каталоге и отправьте его на модерацию

В пункте формы Платформа надо выбрать вариант HTML мобильное приложение. Если вы всё заполнили верно, то вскоре вам придет письмо с доступами к нашей внутренней Jira, где с вами продолжат общение наши специалисты по модерации приложений.

Если у вас появился какой-либо вопрос по платформе мобильных игр и его не оказалось в списке ниже, то можете задать его по почтовому адресу api-support@ok.ru.

Можно ли использовать одно приложение для нескольких платформ

Да, если у вас уже есть игра, доступная в веб-версии Одноклассников, то рекомендуется использовать это же приложение для реализации мобильной его версии. В таком случае это приложение будет иметь общую пользовательскую базу и настройки, что и веб-версия игры. Например, после прохождения модерации мобильной версией приложения оно автоматически появится в списке моих игр на Одноклассниках.

Можно ли указать для мобильной версии приложения другой URL

Вручную в настройках приложения — нет, нельзя. Но возможность иметь разные URL для разных версий приложения имеется, так что при необходимости надо писать заявку на почтовый адрес api-support@ok.ru.

Можно ли указать в настройках приложения желаемую ориентацию на устройстве

Вручную в настройках приложения — нет, нельзя. Но по заявке на api-support@ok.ru, мы можем установить для вашего приложения запуск в альбомной ориентации.

Доступны ли в мобильной версии игровые подписки

Нет, пока что такой возможности на платформе Instant Games нет

Источник

The End of Flash. Tools to Convert Flash to HTML5

• 
• 
• 

2020 brings the end of Flash support across all platforms. For those looking to savor their legacy content and make sure it remains accessible, we’ve rounded up some useful tools to convert Flash to HTML5.

Back in 2017 Adobe officially announced that 2020 will be the last year of their support for the Adobe Flash Player plugin. This marks the demise of Flash-based content. So if you have content still running on Flash, you’ll have to make the transition to HTML5 for it to remain available for users on the web.

Read on to find the latest details on Flash’s end of life along with the tools required for Flash to HTML5 conversion.

Is it really the end of Flash?

Adobe Flash has been slowly pushed to the edge of the cliff for the last 10 years and now it’s finally time to say goodbye. Modern web technologies with cross-platform support and open-source code are taking over.

The interactive multimedia platform’s decline started when Apple rejected Flash back in 2007, refusing to use it for the iPhone’s operating system. Steve Jobs wisely anticipated the foundational change in the multimedia dimension and decided not to use it for Apple’s devices.

It took another critical hit when Youtube also switched from Flash to HTML5 in 2015 to accommodate mobile devices. Youtube users were growing irritated from constantly having to install updates for the Flash Player plugin. Youtube owners were frustrated with how they had to provide different versions of the video portal for mobile and desktop, so they also decided to switch to HTML5.

Following the lead, Google Chrome and other browsers made the switch to HTML5 that same year, which put the last nail in the coffin. After 2015 browsers started blocking Flash content from playing by default. Users had to manually enable it for every page. The main concern was that Flash ran in the background of the browser, causing serious issues in performance, stability, and security.

Facebook and other social media giants which are now platforms for casual games also went with HTML5 technologies.The era when Flash was known for its engaging, interactive, at times very bizarre games is now long in the past.

When is Flash shutting down?

December 31, 2020 was the last time a banner would ask us to turn on Flash to display some content. The plugin is to be removed completely from all browsers via Windows update. As for Macs, Apple has never been a huge supporter of Adobe Flash, so expect them to do the same.

This information is highly critical for companies that still use Flash-based ads. Same as for other Flash-based content in Chrome (and Chromium-based browsers), Flash-based Google and Bing advertisements required a click to be activated and weren’t available at all for mobile internet users. This class of content is now permanently blocked beyond the deadline, starting January 2021.

For those who relied on Flash content these few years after Adobe announced its retirement date – there’s no more room for hesitating. It’s time to make the transition to HTML5.

Find out how we perform updates and build brand new web platforms

Why is Flash going away after 2020?

Adobe Flash is going away because such open web standards as HTML5, WebGL and WebAssembly have developed and are now taking center stage. They allow the same functionality, before only available through the plugin, to be integrated directly into the browser.

A multitude of issues has plagued Flash for years. The main concern has always been lack of security as Adobe struggled to keep up with zero-day vulnerabilities being revealed every other month. Another downside of the player is that it was very heavy. At times Flash applications would drive CPU usage to 100% which would make users go crazy. Browser tabs with Flash content were always running in the background and viciously preying on systems resources, undermining the performance of currently active apps.

Despite the developed codebase and toolkit that was Flash’s ActionScript language, because of these and other usability issues, content makers and leading digital platforms were straying away from the once popular multimedia project. That is a bit sad, as ActionScript was a promising technology and far outweighed the capabilities of JavaScript-based frameworks and libraries in terms of multimedia. Developers had to write a big portion of code in JavaScript to extend the basic functionality to fit the requirements of a real project. Anyhow, Adobe failed to create a fundamental approach to close out the inefficiencies, so here we are now waving Flash goodbye.

Steve Jobs summarized the downsides of Flash pretty well back in April 2010:

• Flash is not an open-source platform which sets barriers for developers and thus seriously impedes development and application of security patches to address faults and vulnerabilities.
• Modern video formats, such as the H.264 no longer need to be coated with an overlay. It can easily be distributed across desktop and mobile devices via HTML5 native video and audio with its convenient Canvas model, thus rendering it the best choice for new content developers.
• Adobe Flash is inherently unsafe and practically unstable, its security has been the main concern since its inception.
• The Flash standard has been designed for and remains centered on desktop devices. Whereas, the contemporary tech horizon is ruled by touch-based mobile devices that rely on lower power consumption with hardware-level decoding and open web standards.

Keeping all these shortcomings in mind, a vast majority of current content creators have wisely made the switch to developing multimedia and interactive web services based on the rich HTML5 platform. If your online products still have any kind of Adobe Flash dependencies, we highly recommend a timely Flash to HTML5 conversion.

Wondering how to play Flash games in 2021 and beyond?

Flash game players and particularly the fans will be taking the hardest blow. There are no automated tools for Flash to HTML5 conversion for this type of content out there. An average game project contains multiple .fla files that rely upon several Actionscript libraries as well as external classes compiled at runtime, coupled with source code .as2 or .as3 files depending on when the game was made (the Actionscript version). To put it simply, there is no magic conversion tool available to seamlessly turn all this into HTML and JS files without any loss.

The only solution to this problem is to recode the game using HTML5 web technologies and this redevelopment process is definitely not cheap. Keeping this in mind, we should expect only the major Flash game titles having large communities of players to make this transition. Otherwise, if you still would like to enjoy the good old flash-based games you used to play, refer to the Flashpoint project. These guys have worked hard to save over 49,000 games and more than 3,600 Flash animations through their web game preservation project.

HTML5 as the new web standard for multimedia content

Still wondering what will replace Flash? HTML5 and related technologies have been stepping on its heels for quite a while and now they are ready to take the throne. The latest version of HTML excels at adaptive content rendering – an area which was previously a serious setback. It also works smoothly for building mobile-ready applications, providing rich APIs whereas Flash was always struggling to accommodate mobile devices.

HTML5 is the latest development of the open web standards that allows creating more powerful and diverse websites with sophisticated multimedia and 2D/3D presentation technology built right in to allow immersive content viewing. With the help of native and components, along with excessive JavasScript API to control interactive graphics, developers can embed first-class audio, video, and effects without the need to rely on third-party plugins such as Adobe Flash player.

The creation of 2D and 3D graphics has become much easier with HTML5 Canvas which is powered by WebGL technology and SVG format for vector graphics. WebGL (Web Graphics Library) is a JavaScript API that lets you take advantage of the device’s hardware graphics acceleration to provide high-performance 3D content rendering. It conforms with the widely accepted OpenGL standards to provide cross-platform compatibility.

SVG allows you to describe two-dimensional vector graphics which can be easily scaled without distortions to fit any screen size. It is also designed to be fully compatible with JavaScript, XML, DOM, CSS and other web tools. Having markup-language structure, SVG images can be easily localized to any language by just programmatically updating the text within. You won’t even need a graphics editor for that matter.

HTML5 also presents intuitive and simple tools for creating subtitles and chapters in audio and video content, as well as Real-Time Communication (WebRTC) technology for controlling videoconferencing.

These simple open-source tools create a boundless environment for developers to build web products that can be used across all modern platforms, including touch-based devices.

Check out this eCommerce web platform designed according to the latest trends

So let’s wave Adobe Flash goodbye and get ready for Flash to HTML5 conversion.

Create your action plan for Flash to HTML5 conversion

Decided you want to keep your amazing Flash content? Don’t know where to begin with the transition to HTML5? There’s a few things you should consider to prepare yourself for Flash conversion.

The amount of work to be done really depends on your project’s size, how much multimedia content it contains, its interactive features, their complexity, and how strongly Adobe Flash is involved. Another issue is the integrity of content itself. Does it stand the test of time? Most projects created just a few years ago will look outdated and probably require some refurbishment. Let alone, they might need a complete makeover or reproduction from scratch. A simple conversion won’t do in this situation.

You need to break down the project and evaluate the content you are dealing with. Some Flash features may not be possible to recreate with native web technologies. Some might not even be worth recreating in the first place.

If it’s just animation, video, or audio content, the conversion process is rather smooth. All we need to do is convert the specific layers and project’s assets from one document type to another. It’s much more challenging if you have an interactive game or other type of application. This means you will have to deal with converting actual ActionScript code.

First thing you would want to do is create an action plan for conversion. We propose the following steps to make your transition to modern web standards as smooth as possible:

• Locate and document your source files, check if anything is missing.
• Determine which graphic and animation assets can be reused.
• Create a cross-reference list and guide to follow during conversion.
• Determine the amount of ActionScript code and work-hours needed for recoding.
• Define a set of standard rules and requirements for all developers to follow.
• Acquire the proper tools and get started with Flash to HTML5 conversion.

Tools to convert Flash to HTML5 in 2021

The internet contains some information about the tools for converting Adobe Flash to HTML5, however, most of it is out-of-date. Some of the tools have been either discontinued or are no longer supported by their developers. For instance, Swiffy was a Flash to HTML5 converter introduced by Google back when Flash was being widely rejected after 2014. Google Swiffy was shut down in 2016 and is no longer available. To address this issue we’ve compiled an updated list of tools that you can conveniently use for Flash to HTML5 conversion.

The Flash to HTML5 conversion tools you need

There are two ways to approach Flash to HTML5 conversion depending on what types of files you have at your disposal. If you have the source .fla and .as3 files, the process will be way easier with Google’s Web designer and Adobe’s Animate CC. If you don’t have the source files but have the actual SWF? Not to worry, there are also some automated tools provided as part of the Haxe and CreateJS JavaScript libraries to convert SWF to HTML5.

See our list below for details about the available tools:

• Adobe Animate CC is the latest incarnation of the Flash Professional editor (and has been rebranded to differential itself as an animation tool without any Flash dependencies). It’s still essentially the same program though and such can still load original .fla files created with other versions of Flash Professional.

The big addition to Adobe Animate is that it now supports HTML5 targets and this offers a migration path for older Flash applications and games created in Flash Professional. Although Adobe Animate does an excellent job of converting old timeline animations, there is no automatic translation path for legacy AS3 code. As such, any AS3 code in older .fla projects will be commented out and needs to be manually ported to Javascript. Another drawback of Adobe Animate is that converted timeline animations tend to be much larger than the original .swf outputs.

• Google Web Designer. Google recommends this free web editor for Flash to HTML5 conversion. It is a good choice if you don’t want to pay the price of Adobe’s subscription. However, you will have to pay an intrinsic price in terms of conversion quality as users report that complex Flash projects may have conversion issues.
• OpenFL is an open-source implementation of the Flash API written in the Haxe programming language. Haxe was originally created in 2006 as an open-source successor to ActionScript 2 and has the ability to compile itself to multiple targets including Javascript, C++, Java, and Python. OpenFL was created in 2013 and designed as a cross-platform implementation of the Flash API. Haxe, combined with OpenFL, allows a developer to target web (html5), PC, Mac, Android, iOS, and even game consoles like the Nintendo Switch.

Many companies have ported their AS3/Flash web-sites to Haxe/OpenFL, for example:

How an application/game is ported from AS3/Flash to Haxe/OpenFL?

The OpenFL API was meant to fully mirror the Flash API. In a complex application or game, it’s a huge advantage as you can have literally 1000’s of API calls that don’t have to be implemented.

AS3 code (similar to Haxe) needs to be ported to Haxe. A tool commonly used is ash3x. Although as3hx automagically converts AS3 to Haxe, it isn’t perfect (and was never meant to be). It gets you about 70% there and a programmer has to finish it off from there.

• Zoë tool from CreateJS. This tool is part of a JavaScript library package that is altogether supported by Adobe, Microsoft, and Mozilla. Zoë is a stand-alone tool for converting .swf animations to sprite sheets that can be used in HTML5 Canvas. This tool works great as it auto-detects your asset dimensions, maintains the same frame labels, and it supports nested graphics.

The animation editor tools are pretty straightforward and offer a lot of tutorial guides. Working with Haxe and JavaScript libraries, on the other hand, can be pretty tricky. You may need to ask a qualified web developer for assistance in using these tools if you are not that much into the technical stuff.

Conclusion

Modern web standards have surpassed Flash in their capabilities and offer a much more seamless experience, without security concerns and performance issues. Developers can now also benefit from an easier way of crafting interactive 2D and 3D graphics, and provide the same great experience to mobile users. The powerful APIs of modern JavaScript frameworks allow them to harness capabilities of user devices to the full extent.

Despite the long-awaited demise of Adobe Flash in 2021, some content owners might still not have made the much-needed transition from Flash to HTML5. This means their users will lose access to their interactive games, video, and audio content. Deciding to remodel your animated content using modern web technologies is not an easy step, but it’s definitely achievable with the help of a team of qualified experts in web development.

We hope this guide and list of conversion tools proves useful to content makers and sets them on the right path. After all, it is the need of the hour to ensure a swift and successful transition to the new web standards.

Subscribe to our newsletter to receive the latest news about technologies, enterprise solutions, tools, frameworks, and more.

Источник