# Mobile player UI アップデート | HTML5 | iOS, Android

モバイル向けHTML5 Player UIが一部改善されました。\
この内容はモバイルデバイス(スマートフォン)でWebブラウザ環境で視聴する場合に該当します。\
(From 2021.03.11) <br>

**現在 (AS IS)**&#x20;

<figure><img src="/files/cBknVR7ReugE6tAH2F4h" alt=""><figcaption></figcaption></figure>

**変更後 (TO-BE)**&#x20;

<figure><img src="/files/YuTGNpVEpoGyyoabxTzv" alt=""><figcaption></figcaption></figure>

#### 主要更新内容 1- スキップ / 巻き戻し (ダブルタップ SEEK)  <a href="#mobileplayeruiappudtohtml5iosandroid-1-sukippukishidaburutappuseek" id="mobileplayeruiappudtohtml5iosandroid-1-sukippukishidaburutappuseek"></a>

<figure><img src="/files/dvhcgoxEmg2ahGDbZiG3" alt=""><figcaption></figcaption></figure>

* タップで再生時点から10秒単位の前後に移動する機能を実装します。&#x20;
* 2回タップで10秒, 3回タップで20秒, 4回タップで30秒のよう、タップ回数を追加すると10秒ずつ移動範囲が増加します。

#### 主要更新内容 2- コントロールバー (control bar) 及びメニュー    <a href="#mobileplayeruiappudtohtml5iosandroid-2-kontorrubcontrolbarbimeny" id="mobileplayeruiappudtohtml5iosandroid-2-kontorrubcontrolbarbimeny"></a>

<figure><img src="/files/MpzDlHgeTb25chNlLYo6" alt=""><figcaption></figcaption></figure>

* 今までコントロールバーに配置した機能を別途タブで統合し、もっと画面自体に集中できるように変更しました。&#x20;
* 倍速, リピート, ブックマーク, 字幕設定などの既存のメニューは右下のボタンをタップした際に表示されるサイドバーに配置されています。 &#x20;

#### 主要更新内容 3- サムネイル / フレーム移動の利便性改善 <a href="#mobileplayeruiappudtohtml5iosandroid-3-samuneirufurmuno" id="mobileplayeruiappudtohtml5iosandroid-3-samuneirufurmuno"></a>

<figure><img src="/files/GOezze4ZgwekHfCy2XyZ" alt=""><figcaption></figcaption></figure>

* サムネイルを拡大し、移動したいフレームの確認をより簡単に確認・移動することができます。&#x20;
* 以下のQRから変更されたUI/UXを確認してください。&#x20;

![](https://chart.googleapis.com/chart?cht=qr\&chs=100x100\&chld=L%7C1\&choe=UTF-8\&chl=http%3A%2F%2Fv.jp.kollus.com%2FSD7Mhk4S)

#### 参照 | Player Skin (Styling)  <a href="#mobileplayeruiappudtohtml5iosandroid-playerskinstyling" id="mobileplayeruiappudtohtml5iosandroid-playerskinstyling"></a>

<figure><img src="/files/dSbGNCc4pBUiCXosekh8" alt=""><figcaption></figcaption></figure>

* VOD コンソール > 設定 > プレーヤースキン/広告メニューからカスタマイズしたPlayer Skinを適用することができます。設定した内容は即時に適用されます。&#x20;
  * [Player Skin](https://catenoid-support.gitbook.io/kollus-player-jp/kollus-video-player/player-skin)

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://catenoid-support.gitbook.io/kollus-player-jp/kollus-video-player/mobile-player-ui-appudto-html5-ios-android.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.