サポート ライブラリを支える技術
class: chapter-1, hero, center, middle # <nobr>サポートライブラリを<br>支える技術</nobr> Android Bazaar and Conference 2016 Autumn 2016/11/19 荒木佑一 --- class: normal, chapter-1 # 自己紹介 .card[ 荒木佑一 [@yuichi_araki](https://twitter.com/yuichi_araki) Developer Programs Engineer @Google - サポート ライブラリ (主に design と transition) - Google I/O アプリ - Google Santa Tracker アプリ - [d.android.com/samples](http://d.android.com/sampl
MERYのUI・UXのつくり方 // Speaker Deck
All slide content and descriptions are owned by their creators.
モーションデザインはUIの未来 | POSTD
最近、「モーションデザイン」という言葉がデザイン業界で急に出てきていることに気づいていますか？大小様々な企業が、これに特化した肩書きを持つデザイナーたちを雇いはじめています。最近ではGoogleが I/Oカンファレンス で、Googleの製品で統一化されているモーションランゲージの概要について話していました。 この騒ぎは何でしょうか？そして何の意味があるのでしょうか？ モーションはストーリーを語ります。 アプリにおける全ての物事は連鎖になっていて、モーションはあなたのガイドになります。ボタンをクリックして、画面が変わる度に、そこにはストーリーがついてきます。例えば、アイテムを作ったり削除する時、アニメーションがどのように役に立つかを見ていきましょう。 アイテムを消すことは劇的で破壊的な作業ですので、適切に反応するようにしましょう。アイテムをただ画面から消すだけということはしないようにしまし
【Sketch】TwitterのUIをトレースしながら研究しよう！（初心者向け） - NOGA BLOG
UIデザイナーの、のがちゃんです！ デザインスキルを上げるには、良いデザインを真似ること。私が尊敬するデザイナーの先輩達は皆口を揃えてそう言います。 １日ひとつdribbbleなどからかっこいいロゴや名刺などを選んでトレースすると良い。 そのときに、なんで自分がかっこいいと思ったのかを考えること。 デザイナーになる秘訣！Time Ticketで、石嶋未来さんに会ってきた - NOGA BLOG UIデザイナーで、本当にスキルを身に着けたい人は、新規事業とかのキラキラした仕事を求めるのではなく、TwitterとFacebookアプリをSketch3で完コピして、何故このUIなのか背景を理解して、Prottで動かして触って、iOSのガイドラインを読み込むと早いと思うよ。 — Tomo Tsubota (@tsubotax) 2016年6月12日 とはいえ、これからUIを学ぼうという方には、どう
Facebookのプロトタイピングツール、Origami Studio発表
UX MILK編集長。株式会社メンバーズ LXグループ所属。LX（ラーニングエスペリエンス）にまつわる新規事業立ち上げなどをしています。ゲームとパンクロックが好きです。 Facebook / Twitter。 近年アプリ制作者の間では、UIだけでなくアプリのUXを検証すべく、プロトタイピングツールの需要が年々高まっています。国内ではPrott、国外ではInvisionやPixate、Flintoなどがありますが、最近だとAdobeもAdobe XDというツールを発表するなど、大手も積極的に業界に参戦しています。 そんな中、Facebookの開発者向けイベント「F8」にてFacebookのプロトタイピングツール「Origami Studio」についてのプレゼンテーションがありました。FacebookやFacebook Messengerのみならず、Instagramやその関連アプリなど、多数
iOS ヒューマンインターフェースの原則 - Qiita
はじめに iOS のヒューマンインターフェースを理解するためにはまず UI 設計の原則を定めた聖典 iOS Human Interface Guidelines を読むことから始めなければなりません。ここにはプラットフォームの特徴からデザインの原則、それぞれの部品が何のためにデザインされたのか、どう利用するのか、iOS を構成する UI の基本指針がまとまっています。 よく、『磨りガラス効果がかっこいい』『アニメーションしておくとイケてる』『ボタンは右配置の方が右手で押しやすい』『流行っているから』……などの観点によって UI の設計が決められることがありますが、そういうことではないのです。いや実際かっこいいかわいいだとかの感覚は重要なのですが、見た目が何となくそれっぽいだけでは優れた UI とは言えません。磨りガラスでも何でも必ずそこには意味があります。だからこそ HIG に書かれた思想
UIPageViewControllerをつかって無限スクロールできるタブUIを実装してOSSとして公開しました - ZOZO TECH BLOG
こんにちは、エンジニアの遠藤です。 最近iQONアプリのホーム画面のデザインをリニューアルしました。 タブを使ったデザインにすることで、iQON内にある多くのコンテンツが見やすくなりました。 今回はこのタブ機能の実装についてざっくりと紹介しようと思います。 実装したものはライブラリーとしてGitHubに公開しているので、ぜひ使ってみてください！ github.com 機能 今回実装した機能は下記の3つです 1. スワイプでページを無限に表示切り替え 2. タブは無限スクロール 3. タブをタップしたらタップした項目のページを表示 実装について 1. スワイプでページを無限に表示切り替え スワイプしたらページの表示を切り替えたいのでUIPageViewControllerを継承したTabPageViewControllerというクラスを実装しました。 今回は無限にページの表示切り替えをしたい
Google、アプリの見やすさや使いやすさに関する改善案を提供する新アプリ「Accessibility Scanner」をリリース|ガジェット通信 GetNews
Google、アプリの見やすさや使いやすさに関する改善案を提供する新アプリ「Accessibility Scanner」をリリース Google が「Accessibility Scanner」と呼ばれる新アプリを Google Play ストアにリリースしました。Accessibility Scanner は、技術的な知識がない人でもアプリのアクセシビリティ性をチェックできるようにするツールです。主にアプリ開発者やデザイナー、テスター向けのアプリになります。アクセシビリティは様々な意味で使われていますが、簡単に言えば使いやすや見やすさのことです。Accessibility Scanner では簡単な操作で画面上に表示されている内容をスキャンして、テキストやアイコン、タッチ領域の大きさ、レイアウトなどに関する様々な改善案を提案します。利用方法は、本アプリの「ユーザー補助機能」を ON にす
UXの効果が数字でわかる！5つのUX KPI : DeNA Creator(クリエイター) Blog
プログラミング教育や社員の健康をサポートする「CHO室」の取り組みなど、DeNAのCSRに関する情報を発信するブログ
Supercharging Your Android Testing — JUnit & Espresso
About the content This content has been published here with the express permission of the author. Testing almost always helps catching bugs and write better code, but it can be a huge pain without a proper framework and setup. At the Bay Area Android Dev Group meeting, Ellen Shapiro explains how to super-charge your Android testing, including UI testing, with JUnit 4 and Espresso 2. She demonstrat
アプリUI制作のチュートリアルで学ぶSketchの使い方 (1/2)
グッドパッチのデザイナーがSketch 3を使ったUIデザインの方法を解説する本連載。第1回ではSketchの魅力についてお伝えしました。今回は、スマートフォンアプリの「Sign upページ」を例に、基本的なUIをデザインする上で必要なSketchの操作を説明します。Sketchの使い方だけでなく、UIデザインに役立つTipsも紹介します。 ※文中の（A）などはショートカットキーです。積極的に使って覚えていきましょう！ Sign upページは、以下の手順で作成します。 アートボードを用意する ナビゲーションバーを置く ユーザーアイコンの画像を丸く切り抜き配置する 入力欄を作成する ボタンを作成する 解説の中では細かい数値や色については触れませんが、同じ数値で作成したい方は図を参考にしてください。また、今回作成する「Sign upページ」のSketchデータはこちらからダウンロードできます。
Presenting BottomSheet — Flipboard Engineering
We are happy to introduce BottomSheet a new Open Source Android UI Component! At Flipboard, we love building visually stunning and highly interactive UIs. When building these UIs, we tend to build them as fairly stand alone components. This makes it very easy for our developers to implement a similar interaction model and aesthetic across the whole product while working in parallel. BottomSheet is
1日に220億回見られる「いいね！」ボタンができるまで--Facebookデザイナーの苦悩 - ログミー[o_O]
1日に220億回見られる「いいね！」ボタンができるまで--Facebookデザイナーの苦悩 あなたの（そして何十億人の）ための巨大なウェブデザインの方法 #1/2 FacebookやYouTubeでユーザーエクスペリエンスデザインを担当してきたMargaret Gould Stewart（マーガレット・グールド・スチュワート）氏。彼女がFacebookの「いいね！」ボタンをデザインした際に痛感した、巨大システムの中にある些細な部分をデザインする難しさ。地球規模のデザインをする際に必要な「大胆さ」と「謙虚さ」とは何かについて語っています。（TED 2014より） 日常に溶け込んだ「気にも留めないデザイン」 マーガレット・グールド・スチュワート氏：デザインという言葉を聞いた時、何を思い浮かべますか？ きっとこういったものを思い浮かべるでしょう。手に取ることの出来る繊細な工芸品やロゴ、ポスター、
![1日に220億回見られる「いいね！」ボタンができるまで--Facebookデザイナーの苦悩 - ログミー[o_O]](https://cdn-ak-scissors.b.st-hatena.com/image/square/08eb52c47798282f4d0677ca775aefb81b971cba/height=288;version=1;width=512/https%3A%2F%2Fimg.logmi.jp%2Fwp-content%2Fuploads%2F2015%2F01%2Fai210.jpg)
UI/UXがイケてる！おすすめスマホアプリ - 第1回 Twitter - MdN Design Interactive
Amebaのクリエイティブディレクターが徹底考察！ UI/UXがイケてる！おすすめスマホアプリ 第1回 Twitter 2014年12月11日 TEXT：佐藤洋介（株式会社サイバーエージェント） より良いユーザー体験を提供するうえで、スマホアプリにおけるUIの工夫やユーザーの心的高価を考慮したデザインなどを、サービスの機能ごとに紹介していく本連載。第1回目ではTwitterの公式アプリを取り上げ、使い勝手とインタラクションを考察していく。 Twitter iOS版 https://itunes.apple.com/jp/app/twitter/id333903271?mt=8 Android版 https://play.google.com/store/apps/details?id=com.twitter.android&hl=ja OSによるユーザー特性を考慮した最適なレイアウトとは？
Rebound - spring dynamics for Android
Rebound is a java library that models spring dynamics. Rebound spring models can be used to create animations that feel natural by introducing real world physics to your application. Rebound is not a general purpose physics library; however, spring dynamics can be used to drive a wide variety of animations. The simplicity of Rebound makes it easy to integrate and use as a building block for creati
Android Activity Transitions を実装する
Activity Transitions のドキュメントを読んだのですが、よくわからなかったので実際に試してみました。 1. window content transitions を有効にする Activity Transitions を使うには、window content transitions を有効にする必要があります。 コードで有効にする場合 getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS); テーマで有効にする場合 <style name="BaseAppTheme" parent="android:Theme.Material"> <item name="android:windowContentTransitions">true</item> </style> 2. transition を指定する
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
Advanced Android Espresso
Android Niceties
http://userinterfaces.io/
