Android版「マネーフォワード」をマテリアルデザイン対応したときのあれこれ - Money Forward Developers Blog
エンジニアの黒田です。 この度Android版「マネーフォワード」アプリをマテリアルデザインにフルリニューアルしました。 そしてなんと！！！ おかげさまでGooglePlayの「2014年ベストアプリ」に選出いただきました！ GooglePlay 2014年ベストアプリ アプリのDLはこちらから 家計簿マネーフォワード【投資・資産管理】 この記事ではマテリアルデザイン対応するにあたり、考えたことや実際に書いたコード、使ったツールなどあれこれと書いてみたいと思います。 マテリアルデザインとは マテリアルデザインとはGoogleが発表した新たなデザインガイドラインです。 モバイルに限らず、AndroidWearやAndroidTVなど様々なデバイスでもユーザーに対して同じ体験を提供することを目的としています。 マテリアルデザインに関する細かい説明は割愛しますが、GoogleMapやGMailな
うっとうしい行動ターゲティング広告を逆手にとった、ポストイットのバナープロモーション | PR EDGE
Case: The banner that makes you like banners インターネットをブラウジングしていて、あらゆるページに飛ぼうとも、画面脇に何度も何度も同じ広告が表示される体験をしたことがある人は多いはず。今回は、時には“ウザく”もある、このリターゲティングバナー広告を“とってもありがたい”ものに変身させてくれるアイディアをご紹介します。 Post-it® The banner that makes you like banners from Proximity Russia on Vimeo. 過去に訪れたことがあるサイトの広告が、ユーザーを追いかけるかのように、何度も何度も画面上に表示されるというリターゲティングバナー広告。広告主側にとっては、再訪問率アップが期待できる有益な手法の一つですが、同じ広告が何度も何度も表示されるユーザー側にとっては、時にはウザったく
Scattered Polaroids Gallery
This first example shows a simple use case without showing a description on the back side of the Polaroid. Clicking another navigation dot will reshuffle the Polaroids and bring the respective current item to the center. Click on the gallery to start it. Serenity Beach Happy Days Beautywood Heaven of time Speed Racer Forever this Lovely Green Wonderful Love Addict Friendship White Nights Serendipi
エンジニアがデザインに取り組んでわかったこと
最近、いくつかのデザインに取り組んでわかったことがあるので、書いておこうと思う。 ぼくは2,3年前にこの業界に入ってからずーっとフロントの実装畑でやってきた。 それは自分の意図していたものではなかったけど、前職のまぼろしという会社は実装が強みの会社だったので、デザインに触れることはほぼほぼなかった。 それもあってか、ぼくは「もうちょっとコストを考慮してほしい」「このあしらいが一体ユーザーにいくらのお金を落とさせるんだろう」とか、あげくの果てには「実装のことを考えたデザインをすべき」とまで考えていた。これらの考え方はぼくだけでなく、コーダーからよく同様の声が上がっている。 だけどデザイナーさんと接する機会が増えるごとに、デザインができるようになったら今までイラついていたことがどんな風に見えるのか確かめたいな、という気持ちになった。 それ以外にも「なにか作るとデザイナーばかり褒められて厳しい」
【デザインまとめ】綺麗なデザインの管理画面 30選
以前記事にした「【デザインまとめ】綺麗なデザインの管理画面 40種類 」、時間が経ってリンク先が消えていたりしますね。 また綺麗なデザインの管理画面も追加したいと思います。 サムネイルだけで見ると、全部似たようなものに見えてきますが、デモサイトを見てみると細かな部分でデザイナーさんの個性が出ていて面白いです。 ご参考になれば幸いです。 左に紺か黒のナビがあるやつ ◆Material Admin デモサイト ◆Edumix 黄緑がきれい デモサイト ◆Make デモサイト ◆Con デモサイト メガネのロゴがかわいい ◆Mega デモサイト 黒でメリハリ ◆Admin box デモサイト ちょっとレトロ感ある色遣いが印象的。 ◆Singular デモサイト やわらかな色遣い。 ◆Azan デモサイト ◆Brio Web App デモサイト 丸みの強い要素がかわいい ◆HeyMetro デモサ
スマホサイトのUIでよく使うメニューのリスト表示まとめ３３サイト ｜ iPhoneデザインボックス
スマートフォンサイトを作るときにヘッダーにメニューアイコンを設置してクリックするとメニューリストがでるようにすることがあります。ナビゲーションの表示の仕方やアニメーションは色々あるのでまとめました。最近は、流行り？なのかFacebookのアプリように横から出てくるメニューが多いです。
「デザイナーなのにマネジャー？」への回答（長い）
興味深いのは、デザイナーが経験を積んでいくとアートディレクターやクリエイティブディレクターになるのは、まあいいとして、ディレクターが経験を積んでいくとなぜか突然クリエイティブディレクターになることがあるという点です。まあ別にいいのですが。あ、というかそこではなくて、興味深いのは、ディレクターはスペシャリスト以降ずっとディレクターと名乗り続ける傾向があるということですね。これが余計に話をややこしくしてる気がするので、無理にでも名称変えたほうがいいと思うんですけど、ディレクターはずっとディレクターっていうの結構あると思います。まあ、もともとディレクターって言い回しが日本語にすると監督なのだから、スペシャリストふぜいがディレクターを名乗るんじゃねえ的なところが本来なのかもしれません。ディレクターのディレクターのところをエグゼクティブディレクターとかにしちゃうと意味が変わってしまうし（取締役になっ
Design Details: Inbox by Google | Brian Lovin
It’s always big news when the Google machine unveils a new product. This week that something new is called Inbox, and it’s a slick rethinking of how we interact with and handle an ever-increasing volume of email. Google’s Design Team has put in hard work these past months. Crafting the Material design language and rolling out interface updates across a suite of apps and operating systems is no sm
ZEPPELIN｜NEWS｜Ando
安藤昌也（千葉工業大学 工学部 デザイン科学科 准教授） NTTデータ通信株式会社（現株式会社NTTデータ）を経て、1998年アライド・ブレインズ株式会社の設立に取締役として参画。ユーザビリティ・アクセシビリティを中心に経営戦略や商品開発をユーザー視点で行うコンサルティング業務に従事。ユーザエクスペリエンスに関する研究で博士号を取得後、2011年から現職。 現在は、ユーザエクスペリエンスや人間中心設計（HCD）、エスノグラフィック・デザインアプローチなどの研究・教育に従事されています。また、HCDおよびアクセシビリティの国際規格に関するISO/TC159（人間工学）国内対策委員などで委員を務められ、現在はNPO法人 人間中心設計推進機構（HCD-Net）理事であり、同機構認定人間中心設計専門家。専門社会調査士の資格も保有されています。 鳥越 早速ですが、まずは安藤先生のご職業、専門分野を
重要視されるためのデザイナーの条件 : could
内輪受けは止めにしようではないか LSD LAB で公開されている UIデザイナー不要説は、テクノロジーと付き合うデザイナーであれば一読しておきたい記事のひとつです。私が記事を読んで感じた課題は、 UI デザインが重要視されているかどうかということではなく、果たしてデザイナーは デザインを営業できているかどうかというところです。 たとえビジネスゴールが共有されていたとしても、デザイナーが考える UI デザインの価値と、それ以外の方が考える UI デザインの価値が異なることがあります。特にデザイナーが考える価値は、内輪受けになりやすいことが多々あるように思えます。デザイナーが「すごく良いよね」「イケてるね」というものは、ほとんどの場合デザイナー以外には理解されません。内輪で分かりやすい言葉や感覚で語りかけても、聞き手は「？」（価値を感じない）になってしまいます。 今でもデザイナーのなかでは「
デバイスに囚われないスマートなコンテンツが必要な理由
たとえ小さな市場を狙ったとしても競争が激しく、せっかく作ったコンテンツはすぐに埋もれてしまいます。また、増え続ける膨大なコンテンツを受け取れる容量をはるかに超えてしまったため、情報の受け皿を小さくしている方もいます。コンテンツ供給は膨れ上がる一方、利用者からの需要が頭打ちしている現在。良いコンテンツを作れば読まれるというわけではないからこそ、前回紹介したような配信の仕方を工夫する必要があります。 しかし、配信を工夫することだけがすべてではありません。コンテンツの設計や作り方を改善することで、狭くなりつつある利用者の窓口へコンテンツを届けることが可能になります。 今だけを見ないコンテンツ制作 昨年のコンテンツワークショップでは、今出回っているデバイスのためだけにコンテンツを作らないための基礎を話しました。Goodpatch の藤井さんとのポッドキャストでは、GUI がない UI デザイン（情
Webデザインの代表的な4つのレイアウト、その特徴と相違点 -Liquidapsive
デモページ Responsive（レスポンシブ） Adaptive（アダプティブ） Liquid（リキッド） Static（スタティック） Responsive（レスポンシブ） レスポンシブは、デスクトップ・スマホ・タブレットなど異なる解像度ごとにレイアウトを定義するのが特徴です。一見するとリキッドのように見えますが、表示サイズに応じて要素の幅のサイズやレイアウトが変化します。 デバイスごとに合わせた一種のリキッドレイアウトであると考えることもできます。 Liquidapsive: Responsive Adaptive（アダプティブ） アダプティブは、デスクトップ・スマホ・タブレットなど異なる解像度ごとにレイアウトを定義するのが特徴です。レスポンシブとは異なり、単にレイアウトを変えるだけではありません。ユーザーのコンテクスト（環境・状況・目的など）に応じて表示するコンテンツ（レイアウト）
年表やSNSのデザインの参考に！タイムラインのサンプル10例 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーのサリーです。 今回は「タイムライン」のサンプルを10例ほど紹介していきます。 たとえばLIGの沿革ページもSNSのタイムラインっぽいデザインになっているように、沿革や実績をタイムラインで見せたいという要望はときどきあるので、デザインの際の参考になればと思います。 それでは、はじめます。 さまざまなタイムライン10例 1. Vertical Timeline http://codyhouse.co/gem/vertical-timeline/ レスポンシブ対応のタイムライン。 JSも使用していて、スクロールでコンテンツが“びよよん”と気持ちいい動きで出現します。 中央のカテゴリーのアイコンがアクセントになっていて、かわいいですね。 2. VERTICAL TIMELINE http://tympanus.net/codrops/2013/05/02/vertical-
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Apple Watch GUI Sketch
MUI: The React component library you always wanted
Drunken Parrot UI Kit - Bootstrap Framework Theme