東京ガスのログイン時のローディングがとんでもない見せ方をしていた→仕様でもミスでもなくChromeの拡張機能が悪さをしていた

2023/02/07 126 users 東京ガス Chrome ミス 拡張機能 仕様

こびと @kobitoCode 「えっなにこれ！？何が起きてるの！？えっ！？えっ！？」と感じている間に5秒経ち、「人はロードに2秒かかったら離脱します」という固定概念をぶち壊せる可能性を感じた twitter.com/ckazu/status/1… 2023-02-06 16:00:47 続きを読む

「ゲームのロード」のために“主人公をわざと転ばせる”PS1ゲームの工夫が話題を集める。意外なかたちで紐解かれる真実 - AUTOMATON

2022/10/17 504 users AUTOMATON つきもの 一例 RPG プレイヤー

ゲームが動作するうえでは、データを読み出すローディングがつきもの。開発者は、ロード時間をなるべく短くしたり、プレイヤーに感じさせづらくしたりと、さまざまな工夫を施しているようで、そうした工夫の一例がSNS上で注目を集めている。 TwitterユーザーMIYAKE氏は10月17日、PS1向けに1998年に発売されたRPG『どきど... 続きを読む

待機状態のUIについて整理してみる(デザイン編)

2021/05/05 141 users Introduction 待機状態 デザイン編 既存 概要

Introduction 概要 待機状態 UI のデザインについての記事です。 待機状態 UI というのは、ローディングや情報の処理待ち時に用いられる UI のことです。 ここで待機状態の UI と読んでいる理由は、各デザインシステムやガイドラインなどで言い方が違うため。 この記事ではデザインガイドラインや既存のデザインシステム... 続きを読む

グーグルが発表した新ウェブ技術「Portals」とは--「Google Chrome」向けのウェブナビゲーションシステム - ZDNet Japan

2019/05/20 326 users Portals Portal 新風 ウェブページ iframe

Googleは米国時間5月7日、年次開発者会議「Google I/O 2019」で、ウェブページのローディングやナビゲーションに新風を吹き込む「Portals」と呼ばれる新たなテクノロジーを発表した。 GoogleによるとPortalsは<portal>という新たなHTMLタグを使って動作するという。このタグの動作は、従来からある<iframe>タグとよく似... 続きを読む

Vue + Vue Router + Vuex + Laravel チュートリアル（全16回）を書きました。 - Qiita

2019/01/14 629 users Qiita CSRF Laravel Vuex Vue

学べること Vue.js と Laravel を組み合わせる ルーティングライブラリ Vue Router を取り入れる 状態管理ライブラリ Vuex を取り入れる タブやローディングを作る Vue.js + Laravel の構成でクッキー認証と CSRF 対策を行う SPA でエラー処理を行う こんな人に読んでほしい Vue や Laravel について、 入門書を読んだあ... 続きを読む

JavaScript - AJAX通信をするときはタイムアウト処理を必ず入れてほしい（切実） - Qiita

2015/07/04 182 users Qiita ICS 鹿野 切実 Ajax通信

こんにちは、ICSの鹿野です。 AJAX通信をするとき、きちんとタイムアウト処理を入れていますか？ スマートフォンやタブレットでWebサイトを閲覧しているとき、地下に入ったりして通信ができなくなるというケースは頻繁に起こります。そんなとき、きちんとAJAX通信のタイムアウト処理をしていないと、場合によってはいつまで経ってもローディングが終わらず、ユーザーが離脱してしまうということが起こります。質の... 続きを読む

PreloadJSで「悩ませないローディング」の作り方―CreateJS勉強会/蔵下発表資料 – ICS LAB

2015/02/17 119 users ICS LAB CreateJS勉強会 CreateJS

こんにちは、ICS蔵下です。 先日行われたCreateJS勉強会 (第5回)にてPreloadJSで「悩ませないローディング」の作り方というテーマでライトニングトークさせていただきました。時間の関係でお伝えできなかった部分も含め本記事でまとめました。みなさまのローディング作りのご参考になれば幸いです。 PreloadJSとは? PreloadJSとは、CreateJSのライブラリモジュールの一つで... 続きを読む

JavaScriptとCSSは不要！SVGの気持ちいいアニメーションで作られた超軽量のかわいいローディング -SVG Loaders | コリス

2014/12/10 129 users コリス SVG Step SVGファイル CSS

JavaScriptもCSSも画像も使用せず、SVGで実装された軽快で気持ちいいアニメーションで動くローディングのアイコンを紹介します。 ページに実装する時もJavaScript/CSSは必要ありません。簡単なHTMLでOK！ デモページ SVG Loadersの使い方 使い方は、簡単！ Step 1: SVGファイルをダウンロード 下記ページの右サイドの「Downlaod ZIP」から、SVGフ... 続きを読む

ワイヤーフレーム制作のための素材セット「The Ultimate Wireframe UI Kit」 | DesignDevelop

2012/08/05 330 users ワイヤーフレーム DesignDevelop ピッ 精度 手段

サイト制作の前に制作するワイヤーフレーム。サイトの構成や構造をわかりやすく事前に見せるためには非常に有効な手段ですが、作る精度によってはかなりの時間を費やしてしまうこともあると思います。今日紹介するのはそんなワイヤーフレームを制作する時間を短縮してくれる、素材セット「The Ultimate Wireframe UI Kit」です。 ローディング、ボタン、グローバルメニューなどなど、サイトにひつよ... 続きを読む

ソースコピーで簡単に使えるCSS3とjQueryで作るローディングページ作りました | HTML5でサイトをつくろう

2012/07/04 289 users CSS3とjQuery HTML5 ローデ jQuery 実際

以前の記事で「画像を使わないでCSS3で様々なローディング用アニメーションをつくってみよう」という形でCSS3でローディングアイコンを作成しました。 しかしあのままでは動きませんので今回は、jQueryを利用して実際にサイトでローディングを行う際のサンプルを作成しました。 サイトでローディングを使うと言っても、使用イメージがつかないと思いますので、まずはサンプルをご覧ください。 今回作成するローデ... 続きを読む

超カッコいいローディングを実現できるjQueryプラグイン「Percentage Loader」:phpspot開発日誌

2012/06/18 154 users jQueryプラグイン phpspot開発日誌 実装

超カッコいいローディングを実現できるjQueryプラグイン「Percentage Loader」 2012年06月18日- Percentage Loader 超カッコいいローディングを実現できるjQueryプラグイン「Percentage Loader」 次のようなカッコいいローディングが簡単に実装できます。Canvas描画なのでサイズ変更等も自由にできるみたい 超シンプルに実装可能です なんと... 続きを読む

画像を使わないでCSS3で様々なローディング用アニメーションをつくってみよう | HTML5でサイトをつくろう

2012/06/13 490 users ローディング用アニメーション CSS3 HTML5 ギミック

スマートフォンのように読み込みに時間がかかるデバイスの場合や、ギャラリーサイトのように複数の画像を読み込む場合、大掛かりなギミックのJSを読み込む場合など、最近はFLASHでなくてもローディングを使用しているサイトをよく見かけます。 今回はそんなローディング用アニメーションをCSS3のグラデーションやアニメーションを使って、画像を使わずに制作する方法を、様々なローディング用アニメーションの種類とと... 続きを読む

HTML5演出に最適な画像読み込み管理のJSライブラリ「LoadManager.js」 | ClockMaker Blog

2012/02/14 550 users JSライブラリ ClockMaker Blog 前者 見栄え

HTMLで画像を読み込むとき、HTMLのimgタグだけだと不恰好となりがちですが、読み込みを管理すれば見栄えも整いますというデモとJSライブラリを作ってみました。次の2つのデモを見比べて何が違うのか確認ください。 デモ (通常のimgタグ) デモ (LoadManager.jsを使用) デモの違いとは 前者は画像がバラバラとインターレース的に読み込まれ、後者は読み込み終わるまでローディングが表示さ... 続きを読む

おHTML5｜2012年 ブラウザで祝うお正月

2011/12/31 174 users ブラウザ お正月 ダルマ ご挨拶 初日の出

ブラウザから新年のご挨拶！お正月気分を味わえる、ちょっと贅沢なコンテンツ集。ブラウザ凧揚げ ブラウザをドラッグして 上手に凧を上げてみよう。 リズム餅つき アドレス欄を流れる □と■が合わさったら タイミングを合わせて クリックしよう！ ローディング初日の出 いつもの見慣れた ローディングが、 初日の出になりました。 ラジオだるま だるまの目が ラジオボタンに。 目に墨を入れて、 願掛けしよう。 ... 続きを読む

CSSだけで必殺技を作るコンテストのクオリティーが高すぎる件 | KAYAC DESIGNER'S BLOG - デザインやマークアップの話

2011/12/13 500 users KAYAC DESIGNER クオリティー spec CSS

jsdo.itで「SPEC」というコーディングコンテストを開催しています。 今回のテーマは以下の二つ。 CSSだけを使って必殺技の演出を加えてください ローディングの演出を考えてください 「こんなマニアックなテーマだけど参加してくれる人がいるのだろうか…！」と心配していたのも杞憂に終わり、続々とすごい作品が投稿されています。 開催期間中ですが、ぼくが個人的に「これは！」と思った作品をピックアップし... 続きを読む

[JS]これFlashじゃないの？ってなるナビゲーションを実装するjQueryのチュートリアル | コリス

2011/03/27 655 users グリッド jQuery メインメニュー コリス div要素

まずは、デモページを堪能ください。 ナビゲーションの各ラベルをクリックすると、それに対応したパネルがアニメーションを伴って開くようになっています。デモページ実装HTMLの構造は、背景画像、グリッドのオーバーレイ、ローディングのアイコン、メインメニューの4つから構成されています。HTML：背景背景は、背景画像とオーバーレイとローディングをdiv要素で内包します。 続きを読む