スマホ向けサイトをアプリっぽく見せるために半年間頑張ったことをまとめる - Qiita
この記事は リクルートライフスタイル Advent Calendar2018の20日目の投稿です。 はじめに この記事では スマホ向け web ページをアプリっぽく見せるための Tips を多く紹介します。 (CSS / JS / jQuery / React / WebGL の事例を紹介します) （注） React 環境でのサンプルコードが多めですが、実装方法はどの環境でも変わらないと思います。ライブラリも同種のものが存在しているはずです。 最近だと、僕の大好きなアプリで味わった体験を、どうすれば Web で再現できるかなーって考えていました。そうしたネイティブアプリをWebで模倣したときに、知ったTipsやテクニックをまとめていきます。 この記事に書いてあること アプリっぽい体験はどのようなものがあるか CSS / JS / jQuery / React / GLSL を利用したネイテ
スマートフォン用Webアプリをホーム画面に追加することを促すJavascriptライブラリAdd to home screenの使い方 - MyEnigma
スラスラ読める JavaScript ふりがなプログラミング (ふりがなプログラミングシリーズ)posted with カエレバリブロワークス インプレス 2018-06-22 Amazonで探す楽天市場で探すYahooショッピングで探す 目次 目次 スマートフォンWebアプリをホーム画面に追加してもらいたい Add to home screenの使い方 Add to home screenの設定 app ID lifespan skipFirstVisit startDelay displayPace Add to home screenの日本語の表示がおかしい件 参考資料 MyEnigma Supporters スマートフォンWebアプリをホーム画面に追加してもらいたい 最近趣味でスマートフォン用のWebアプリを作っているのですが、 myenigma.hatenablog.com ネイ
目から鱗のスマホユーザー体験、情報は長くなっても1ページにまとめた方がいい？ | 企業ホームページ運営の心得
コンテンツは現場にあふれている。会議室で話し合うより職人を呼べ。営業マンと話をさせろ。Web 2.0だ、CGMだ、Ajaxだと騒いでいるのは「インターネット業界」だけ。中小企業の「商売用」ホームページにはそれ以前にもっともっと大切なものがある。企業ホームページの最初の一歩がわからずにボタンを掛け違えているWeb担当者に心得を授ける実践現場主義コラム。 宮脇 睦（有限会社アズモード） ※1 やっぱり！ ハンバーガーメニューをやめたらPVも再訪問も劇的に改善！ などSEO記事まとめ10+3本 右か左か論争スマホ向けのコンテンツの課題は、情報量が限られる小さな画面にあります。PC閲覧を基本にデザインされてきたWebコンテンツは、画面の上下左右のいずれかに「メニュー」が常駐されているという常識がありました。しかし、スマホでこれを守ると一画面あたりの情報量が少なくなります。 そこで画面を有効利用する
モバイルのUXデザインにおけるベストプラクティス
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 アプリはコンテンツやサービスを提供するための、今日（こんにち）の主流かつ確かな方法です。しかし、飽和状態の市場でユーザーを満足させ、その興味をつなぎとめるために、どうすればモバイルアプリは意義や価値のあるものとなるのでしょうか。 この記事では、素晴らしいモバイルUXを作る鍵となる、UXデザインのための７つのヒントをご紹介します。 １. 一つの画面につき、一つの操作 ユーザーが情報を取得する際の努力を軽減する 皆さんがデザインするアプリの画面では、ユーザーにとって最も価値のある一つの動作を助長するものでなければなりません。各画面を一つの目的だけのためにデザインし、Call to Action（行動喚起）は一つに留めましょう。こうすることで、ユーザーはアプリを理解・
リリース後、どう周知すればいい？企業アプリの拡散方法まとめ
企業が自社サービス関連アプリをリリースしても、世間に知られている著名な企業でない限り、なかなかダウンロード数が伸びることはありません。 ユーザーがダウンロードするアプリはゲームやツールカテゴリのものが多く、それ以外は全体の1/3以下です。 新規ユーザーではなく、既存ユーザーをターゲットにすればダウンロードしてもらえる可能性は高く、エンゲージメント向上にも寄与するでしょう。 今回は、自社の既存顧客向けのアプリ周知方法について解説します。 広告を出稿して周知を図る方法もありますが、まずは既存ユーザーに直接届ける方法から取り組んでみましょう。 ユーザー層によってアプリの利用度合いが違うことを理解しよう 無数のスマートフォンアプリが配信されている現在、ユーザーは実際どれだけアプリを利用しているのでしょうか。 Googleでは200万以上のアプリが配信されていますが、その中からユーザーが利用するのは
衝撃！スマホアプリのUIは3年でどのように変化しているのか調べてみた。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ いつも元気ハツラツ・天真爛漫・平成生まれゆとり世代、のんちゃんです。 わたしは中学2年生の頃から携帯電話なるものを使用し、友達とコミュニケーションをとっていました。ちなみにPCは小学4年生くらいから夢中に触っていて、親に電源抜かれたこともありましたねぇ。 ガラケーからスマホにしたのは5年前の大学1年生の時だったと思います。最初はAndroidでしたが、その後はずっとiPhoneです。 昔のiPhoneであろうとも、いまの充電器があればカメラロールとかメールとかを見返せるのがおもしろくて、実家に帰ってとてつもなく暇な時は、ひとりでそういった遊びをしています。 ちなみにすごくどうでもいいのですが、わたしはiPhoneを変更しても、あえて写真とかは引き継いで移行させません。 思い出は、そっと大事に眠らせておきたいのです。 さて、前置きが長くなりましたが、過去のiPhoneを漁ってい
モバイルアプリにおけるナビゲーションUIのデザインパターン
アプリのナビゲーションは、直感的で予測ができなければいけません。新規のユーザーや再訪問したユーザーが、アプリをどのように使ったら良いか迷わないよう、理解しやすくする必要があります。 しかし小さい画面という制限の中で、コンテンツの優先順位を考慮しながら、ナビゲーションを使いやすくすることは非常に難しいです。 この問題に、様々なナビゲーションを使って異なる方法で立ち向かっていますが、多様なユーザビリティの問題に、皆悩まされています。 そこでこの記事では、モバイルアプリの基本的なナビゲーションであるハンバーガーメニュー、タブバーとジェスチャーベースのナビゲーション（タップやフリックを使用したナビゲーション）の３つについて検証し、それぞれの長所と短所を説明します。 ハンバーガーメニュー 画面のスペースは、モバイル上の貴重な商品であり、画面の節約に役立つモバイルナビゲーションのパターンのうち、ハンバ
モバイルSEOに役立つGoogle純正ツール×5
[対象: 初〜中級] この記事では、モバイル向けサイトのユーザビリティやユーザーエクスペリエンスの向上に役立つ、Googleが提供する公式ツールを5つ紹介します。 Chrome PageSpeed Insights Mobile-Friendly Test Fetch as Google モバイルユーザビリティ レポート 順に説明します。 Chrome Google Chromeの「デベロッパー ツール」では、スマートフォン端末で見たときのそのページの表示をエミュレーションできます。 「デベロッパー ツール」は次の手順で起動します。 [Google Chromeの設定]（右上の3本バー） − [その他のツール] − [デベロッパー ツール] Ctrl + Shift + i (Windows) / Cmd + Opt + i (Mac) スマホを表すアイコンをクリックするとスマホでの表示モ
モバイルにおける入力フォーム最適化(EFO)の７つのルール
皆さんのアプリやサイトを利用するモバイルユーザーには、特定の目的があります。そして多くの場合、ユーザーとその目的の間に立ちはだかっているのはフォームです。 実際には、フォームは目的を果たすための道のりにおいて、最後のステップであると考えられることが多いです。だからこそ、ユーザーが戸惑うことなくできる限り早くフォーム入力を完了できるようにすることが重要なのです。 次の７つのルールに従って、素早く簡単に完了できるフォームを作りましょう。 ルール１：フォーム表示をふさがない キーボードなどのインターフェース要素により、フォーム表示がふさがれないようにしましょう。ユーザーがフォームへの入力を完了したら、入力フィールドを自動的に画面の上へ送るようにしましょう。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
