アニメーションを使った効果的なモバイルなトランジション例
アニメーションはユーザー体験において重要な要素です。モバイルアプリ画面のトランジションにおいて、アニメーションで伝えられることはたくさんあります。メッセージ送信、設定画面を開く、チェックボックス、別ページへの誘導などはすべて画面のトランジションです。それらをアニメーションで表現することはユーザーのアクションを促進する効果的な方法です。 この記事ではデザインを引き立たせ、ユーザーとの意思疎通やアクションを促すような効果的なアニメーション事例をレビューしていきます。 システムステータスの表示 何らかのアクションをユーザーが行った際には、そのアクションを受け取り処理していることをビジュアルレスポンスで明確に示す必要があります。アニメーションによるフィードバックがユーザー体験において有益なケースがいくつかあります。 ユーザーの操作に対する「反応」をきちんと返しましょう。ユーザーはシステムがアクショ
読みやすさのデザイン備忘録 | 深津 貴之 (fladdict) | note
noteのコア体験は、「読む楽しさ」と「書く楽しさ」だと考えています。 本来ならコア体験は、調査でしっかりと導くべきものです。しかしアカデミックなUXとは異なり、実際のスタートアップ環境では時間とリソースに限界があります。このため調べながらも、走り出さなければなりません。 まず序盤はヒューリスティック（経験）ベースのデザインを行いつつ、調査やテストが可能なところから、裏づけやチューニングを行う流れになりそうです。 以下、「読書体験」における「可読性」のパートのメモ。noteチームにとりあえず提案する予定の諸々です（現時点では個人の見解です）。基本的には「当たり前のことを、当たり前に」やる予定。「これもやっとけ」的なことがあれば、タイポグラファーの諸先輩の方々には、ぜひご意見をお伺いできればと。 書体をサンセリフ系に変えるべきか？デジタルでは、一般的にサンセリフ体の可読性は、ローマン体よりも
Primer of Information Architecture 2016
情報アーキテクチャ入門 DevLOVE関西 Mar. 18th 2016 Designed by IMPATH
I/O 2014 アプリに学ぶマテリアルデザイン
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
話題のMaterial DesignをWebで実現！Polymerで「Paper Elements」を試そう
話題のMaterial DesignをWebで実現！Polymerで「Paper Elements」を試そう 佐藤歩（株式会社サイバーエージェント） この記事では2014年7月にGoogle I/Oで発表されたMaterial Designについて、どのようなコンセプトなのか、これまでのデザインガイドラインと何が違うのか、ポイントをおさえて紹介します。記事の後半では、Material DesignをWebで実現するためのPolymerとPaper Elementsに関しても説明します。 Material Designという視覚的言語 Material Designの目的は、ひとつの視覚的な言語（Visual Language）によって、あらゆるプラットフォーム、あらゆるスクリーンサイズのデバイスで、一貫性のある体験を提供することです。 それを実現するため、伝統的なグラフィックデザインとテク
最新鋭のノートPCには欲しいヤツがないので、泣きながら一世代前の機種を購入したという話。
先日、別のエントリでも書いたが、実は最近ノートPCを新調した。以前使っていたものが購入後3年経過し、サポートが切れたからだ。サポートに従事するものとして、やはりサポート期間というものは大事にしなければならない。（ちなみに、以前のマシンも壊れているわけではないので、クッキーを焼いたりするのに大いに役だってくれた。メインマシンが壊れるなど、いざという時にはいつでも活躍できるようスタンバイしてる感じだ。バックアップがあるのはやはり安心である。） というわけで、本日は新しいマシンについて何故これを選択したかという話や、設定などを紹介したいと思う。 外観など今回購入したのはThinkpad W530というモデルである。早速フリーソフトウェア財団のステッカーを貼った。白地のステッカーは黒によく映える。 インテルインサイドやWindowsロゴのステッカーは邪魔なので速攻で剥がした。邪魔者がなくなってスッ
フロントエンド開発者向けのAlfred Workflow - アインシュタインの電話番号
1ヶ月前に、Web開発者にオススメなAlfred用のWorkflowをまとめたGitHubリポジトリが2,000 starsを超える人気を博していて、その中に自作のFont Awesome Workflowも選ばれていて、それをきっかけに開発者向けのWorkflowが盛り上がっていることを知った。[^1] [^1]: このリポジトリは更新が遅く、各Workflow作者の最新バージョンを反映していない問題があったため、Font Awesome Workflowではこちらから削除依頼を出してリストから消してもらいました。そのため現在は掲載されていません。 つい最近だと、Googleのエンジニアで著名なAddy Osmaniがプレゼンで紹介していたり、フロントエンド向け情報サイトとして有名なSmashing Magazineが特集記事にしていた。 Automating Front-end Wor
検索と入力と登録の融合 : 続・ユビキタスの街角
一般に「検索」と「入力」は異なるものだと考えられている。 検索というとGoogle検索やデスクトップ検索を連想するだろうし、 入力というとキーボードや日本語入力システムを連想することが多いだろう。 しかし検索と入力は実は似たようなものである。 下図は私が公開している Gyaim というMac用のIMEである。 「艦これ」という単語を入力しようとして「k」「a」「n」...と順番にタイプすると、 「k」で始まる単語、「ka」で始まる単語が順番に候補として表示される。 Gyaimは入力システムであるが、 動作は単純であり、 ユーザが入力した文字列にマッチする単語を辞書から検索して候補として表示して 選択可能にしているだけである。 つまり、比較的単純な検索システムを入力システムとして利用しているわけで、 検索システムと入力システムは関連が深いものだということができる。 「艦これ」という単語は辞書
Qiitaのtextarea自動補完がOSSになりました - Qiita
jQuery.textcomplete（デモ） GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 を書いたのも今は昔、いつか続きを書こう書こうと思いながら気がつけば5ヶ月が過ぎました なんか続きを書くのが面倒くさくなったのと、某日本最大レシピ共有サイトの技術部長の人から「OSSにして欲しい」という要請を人伝に受け取ったこともあって、OSS化した次第です。 ライセンス MITライセンス 簡単な使い方 簡単に説明します。詳しくは README を読んでください。 まず jQuery.textcomplete は名前からも分かるように jQuery プラグインになっているので、別途 jQuery が必要です。 <script src="path/to/jquery.js"></script> <script src="path/to/jquery.textcomp
Interface Buttons for iPhone & iPad Applications / Design Tickle
Interface Buttons for iPhone & iPad Applications Featured Image credit to George Gliddon The iOS revolution is in full swing with tons of active developers jumping into the Xcode environment. But programming an application and designing the user interface are two entirely distinct tasks in their own right. Buttons and toolbar icons are important to many of the standard iOS elements. In this galler
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - facebookarchive/flux: Application Architecture for Building User Interfaces
Loading...