Placehold.it - Quick and simple image placeholdersOne place to find your commercial real estate rentalSimplest way to search listings across the web
ファーストビュー盲信がもうしんどい
Updated 2015.04.27 / Published 2015.04.27 「ファーストビューが全て」のようなファーストビューについては盲信的な記事も多く、ファーストビュー云々のことで煙が立ち始めて、火がついてしまうと、上手く説得を試みようにも聞く耳をもってもらえず、困り果てるディレクター・デザイナーの方も多いのではないかと思います。ファーストビューはもちろん大事ですが、盲信的に傾倒することには疑問を感ぜざるを得ず、ファーストビュー問題はいつになっても考えものです。 ファーストビューのボヤは気付き難い ディレクターやデザイナーの方ならプロジェクトが進行していく中で、ファーストビューが問題になったことが一度や二度はありませんか。「いやいや、ファーストビューはちゃんとガチガチに予防線を張っているよ！」というディレクターの方も、きっと過去に苦い経験があるのではないでしょうか。 個人的にフ
Web API: The Good Partsを読んだ - AnyType
Web API: The Good Parts 作者: 水野貴明出版社/メーカー: オライリージャパン発売日: 2014/11/21メディア: 大型本この商品を含むブログ (1件) を見る 業務ではiOSアプリとバックエンドの開発を両方担当しているので、APIの設計を何回かやってきた。しかし、自分なりのやり方でやってきた部分が多かったので、最近発売されたWeb API: The Good Partsを読んでちゃんとした設計について学ぶことにした。 得られた学びをメモとして残す。 HATEOAS HATEOAS（Hypermedia As The Engine Of Application State）という設計方法を初めて知った。HATEOASではまず、サーバー側はレスポンスに関連するエンドポイントを含め次にアクセスするAPIを簡単に辿れるようにする。クライアント側は最初のエンドポイント以
クソエンジニアが最速でそれなりのWebデザインをできるようになる方法 - UIU
趣味などでWebサービスを作るときにもっとも悩ましいことのひとつがデザインだと思う。外観は重要な要素だとは理解しているし興味も一応あるけれど、実践に乏しいからどうしていいのかわからない。かといって、タダで頼めるような都合のいいデザイナーはいない。結局めんどうになって、Twitter Bootstrapで体裁だけでっち上げた妙にオタク臭いデザインになってしまう。僕もかつてはデザインを気にも留めないクソエンジニアだったけど、必要に迫られて勉強したらそれなりに手を動かせるようになったのでその方法を紹介する。僕が今年入社したスタートアップにはデザイナーがおらず、新機能を作るときなど仕方なくデザインをこなす必要があった。結果的に、仕方ないなりにPhotoshopを使ってプロトタイプを作りHTML/CSSコーディングするくらいはできるようになった。ここに書くのは仕方なくそれなりのWebデザインをする方
エンジニアこそ色彩デザインを学ぼう - ppworks.jp
学ぼうよ、と思っていて、 新人デザイナーのための色彩デザイン・配色のルールを学べる本 作者: 柘植ヒロポン出版社/メーカー: ソシム発売日: 2011/10/01メディア: 単行本 クリック: 1回この商品を含むブログを見る を読んでいました。 @ken_c_lo氏が以下のスライドで触れていますが、エンジニアがデザイン学ぶのマジオススメとのことです。よっしゃ、学ぼう。 新人デザイナーのための色彩デザイン・配色のルールを学べる本 新人デザイナーのための色彩デザイン・配色のルールを学べる本 作者: 柘植ヒロポン出版社/メーカー: ソシム発売日: 2011/10/01メディア: 単行本 クリック: 1回この商品を含むブログを見る WEBというより印刷のデザイナー向けの本なのかな？という印象なのですが色の使い方という意味では勉強になりました。 特色の話やCMYKプロセスカラーの話は一旦無視しながら
WebエンジニアのためのWebサービスデザイン実践講座
DeNA 社内勉強会に呼んでいただいて、お話させていただきました。 Reviewに登場していただいてるサービスはこちらです。 動く小説投稿サイト Denkinovel by @katryo さん http://denkinovel.com/ ご協力ありがとうございました( ˘ω˘)
4色ほど指定するだけでTwitter Bootstrapの配色を良い感じにしてくれるSass | mah365
そんなSassが町田先生のCustomizedTwitterBootstrapに含まれていたので、これをTwitter Bootstrap3に対応させてみたのでした。 ソース こちらが良い感じにしてくれるベースの変数です。 $base-color、$main-color、$accent-color、$base-text-colorを決めることで良い感じにしてくれます。僕は下のファイルみたいなテイストが好きです。ほんわかしている。仕事では使えない感じがある。 実際に読み込むときには、Twitter Bootstrapより先に変数を読み込んでおきます。 //--------------------------------------------------------- // Color Scheme for Bootstrap @import colors/try @import color
Webサイトに変なスクロール使うのをやめろ
最近変なスクロールを使ってるサイトを見る。 これとか http://www.apple.com/iphone-5s/ これとか http://heteml.jp/ 他にも色々。 Javascriptがなんか頑張ってんだろうけどさ、 正直鬱陶しいよ。 やけに重いし、使いづらいし。 Chromeだとヌルヌル動くって？ みんなChrome使ってる思ってたらアカンでほんま。 追記： この変なスクロールはパララックスと言うそうです。 「この変なスクロール＝パララックス」ではないそうです。 また、「この変なスクロール＝パララックスのひとつ」と言う訳でもないみたいです。 ごめんね、もうこの追記消したい気分。
UI変更バトルに勝利するための方法考えた - yashiganiの英傑になるまで死ねない日記
UI変更批判バトルと複数のバージョンのウェブサービスを同時に配信することについて - hitode909の日記 を読んで，同じようなこと前から考えていて昨日ひょんなことからブレイクスルーがあったので共有します． ウェブサービス，UI変えると，改悪とか，元に戻してとか，そういう意見が出る． ウェブサービスだけじゃなくてアプリでも同じような問題抱えていて，アプリの場合はストアの評価システムみたいなのがあって，そこにこういう意見が書かれまくる． アプリの場合はウェブサービスと違って，ユーザの選択でアップデートしないとかもできるので，余計に状況が悪くて「こんなことならアプデしなけりゃよかった」とかも平気で言われる． 実際iOS 7が出たときに担当しているアプリで同じようなこと経験したことがあって，iOS 7のあたらしくなったiPhoneにいつも使っているアプリが完全に対応したら最高のユーザ体験だろ
少ない装飾で素材の魅力を生かす、ズルいWebサービスデザイン実践編 // Speaker Deck
WCAF Vol.11 「Design」 in 福井 で発表させていただきました。 http://wcaf.doorkeeper.jp/events/7028 協力： we love heroku by @ppworks http://welove.herokuapp.com/ （参考）ppworks 氏によるエントリー http://www.genuineblue.jp/posts/weloveheroku-design-renewal/ ズルいデザインテクニック2013 + セミフラット version - in 福井 https://speakerdeck.com/ken_c_lo/zuruidezaintekunituku2013-plus-semihuratuto-version-in-fu-jing
ズルいデザインテクニック2013 + セミフラット version
[大阪] プログラマー向けデザイン勉強会で発表させていただきました。 http://connpass.com/event/3086/ --- [あわせて読みたい] KSSで作るパターンライブラリ by @machida https://speakerdeck.com/machida/kssdezuo-rupatanraiburari 【アイコンを200こ描いた振り返り！】アイコンから知るデザインのヒントby @awayuki http://www.slideshare.net/awayukin/awayuki-pmd01-share ビジュアルデザインまでのデザインワーク by @yokotak0527 http://www.slideshare.net/YokotaKenji/ss-26460108
ブックマークをTwitterへ投稿する際のURLを「ブックマークした元のページ」に統一しました。あわせて、Twitter連携機能で複数の改善を行いました - はてなブックマーク開発ブログ
本日、はてなブックマークの「ブックマークをTwitterへ投稿する機能」「TwitterでツイートしたURLをブックマークする機能」の2つの機能について、それぞれ改善を行いました。 「ブックマークをTwitterへ投稿する機能」の改善 Twitterへ投稿したときの短縮URL（htn.to）のリンク先を「ブックマークした元のページ」に統一 コメント一覧ページのツイート設定を、「コメント一覧ページのURLも同時に投稿できる設定」に変更 ブックマークのタグを、Twitterではハッシュタグとして投稿 「TwitterでツイートしたURLをブックマークする機能」の改善 Twitterのハッシュタグも、ブックマークのタグとして認識 ツイート本文の大部分がリンク先のタイトルである場合、ブックマークコメントを自動的に省略 以下、順番にご説明いたします。 「ブックマークをTwitterへ投稿する機能」の
tumblrのYouTube埋め込み表示がカッコイイ
最近tumblrのダッシュボードで流れるYouTubeの埋め込み表示が変わって「お!」な感じだったので調べてみました。 まずYouTubeの動画を普通に貼りつけると、こうなります。 特にこれでも問題ないというか、Youtubeの特徴的な再生ボタンのおかげで十分動画だと分かります。しかし最近のタンブラーの動画サムネはこのように変わりました。 面白いですね。ノイズが動いているおかげで、より動画っぽい印象が増しています。 劇的な変化でもないし、良くなったか悪くなったかは微妙な所ではありますが、個人的にはタンブラーらしい変化かなと思いました。※タンブラーは機能が増えるよりも減ることに喜びを感じる思想を持ってます。 というわけで、ソースを覗いて実現法を見てみましょう。 実装方法 通常のYoutubeの埋め込みコードはこちらです。iframe一行のみ。 <iframe loading="lazy" w
フラットデザインのコツ的なアレ - 納豆には卵を入れる派です。
P4Dで教えていただいたエンジニアさんに聞かれたので、なんか整理しきれてなくてざっくりなんですが、取り急ぎ、なんかそれっぽくなるコツみたいなのを独断と偏見でまとめてみました。 3色〜5色くらいの色を画面の中で均等に使うのおすすめ 作りたいサービスが何で色分けできるか考えます。ちょうどよく3〜5種類くらいのステータスやカテゴリなどがあったら、それに応じて色が変わるとかするとうまくハマる。かも。 Flat UI Colorで色選び http://flatuicolors.com/ という便利なサイトがあって、ここから3〜5色くらい選ぶとよいです。クリックするとカラーコードがコピーされます。あら便利。赤は他の色と仲良くするのが難しめ。 Sassで彩度を抑えると落ち着いた色調になって、使いこなしの難易度が低くなります 上のサイトもそうなんですが、Flat UIによく使われている色は、鮮やかなが多く
» スマートフォンサイトのユーザビリティを下げるアンチパターン | Webnoborder
モバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金からモバイルデザインパターン― ユーザーインタフェースのためのパターン集を読んで、スマートフォンサイトのアンチパターンも作りたいと思ったのがキッカケで作ってみました。 独断と偏見で評価しています。 反応エリアを探させるアコーディオン 「お金から探す」周辺のリストがアコーディオンになっていますが、テキストの部分をタップしても何も動作しません。 プラスアイコンの部分をタップしないと反応しないのです。 このようにタップ領域がユーザの意識と違う場所に設定されているのは、ユーザビリティに問題があるといえるので改善が必要でしょう。 参考サイト スマートフォンサイトにお
レスポンシブWebデザインは「分けて考えない」でうまくいく
2013年4月7日 著 レスポンシブWebデザインにおけるコーダーの役割という記事を読みました。冒頭、自分では思ってもいないところでリツイートされましたとありますが、何を隠そう僕もリツイートした一人であります。記事に書かれている内容については基本的に賛同できるのですが、これを機に以前から思っていたことを二点ほど、まとめておこうかと（既にTwitter上でつぶやいたことと重複しますが）。 一点目は、レスポンシブWebデザインの場合、スクリーンサイズなりスクリーン幅ごとに「分けて」考えないほうが、うまくデザインできるのではないか？ということ。逆に言えば、分けて考えれば考えるほど、うまくデザインできないように思います。たとえばスマートフォン、タブレット、デスクトップPCそれぞれに完全に「分けて」デザインされたものをメディアクエリーで合体させたところで、それが優れたレスポンシブWebデザインと言え
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ken_c_lo / TAEKO AKATSUKA (@ken_c_lo) on Speaker Deck
大飴屋
KSSで作るパターンライブラリ
Basic Design Note
