Webデザインの見せ方やアイデアが素晴らしい、最近気になったチェックしておきたいWebサイトのまとめ
Webデザインのセンスを磨く方法の一つは、他人の作ったものを数多く見ること。 コンテンツの見せ方やレイアウト、繊細なアニメーションを使ったインタラクションなど、デザインのアイデアが素晴らしい、最近気になったチェックしておきたいWebサイトを紹介します。 Wrk フランスのWeb制作会社のサイト。ぱっと見、普通の矩形パネルに見えますが、CanvasとSVGを使った弾力性に富んだレイアウトやグラフィックは非常に楽しめます。 縦長ページの構成は新感覚で、ナビゲーションのスマホ時にフッタのコンテンツと合体するのはいいアイデアですね。 Booounce! ショートムービーやアニメーションGIFをコレクションしているサイトで、バウンスの名のようにバウンドを伴うエフェクトが気持ちいいです。ナビゲーションの細かいアニメーションをはじめ、一覧表示、進むと戻る、作品の見せ方、なにもかもがインタラクション性に優
Bootstrapの画面を手軽に作れるツールまとめ
業務システムの画面やWebサービスの管理画面にBootstrapを採用するケースが増えていますが、それでもBootstrapならではの書き方を覚えないといけません。バージョンが上がるごとに書き方が変わるので習得が面倒と感じる人も多いでしょう。 そこで使ってみたいのがBootstrap用のUIビルダーです。ドラッグ&ドロップで画面が設計できれば作成も簡単ですよね。 lollytin beta 1.4 – A yummy HTML5 blockouterer! Bootstrapのデザインをドラッグ&ドロップで作っていくのですが、見た目はデフォルメされています。その分、細かいところにこだわりすぎずにさくさくと作っていくことができます。 Pingendo – web authoring with comfort PingendoはBootstrap専用のオーサリングソフトウェアです。Mac OS
凄い！ISO感度の高い写真をPhotoshopで劇的にノイズ除去する方法！
この花火の加工の方法は1枚1枚写真を足していって1枚の写真に仕上げています。下記のこのような写真を足していくと上記の画像のような写真になります。 --- では逆にこの写真の花火の部分を引いていくと、 と考えました。 実はこの「複数枚から同じ部分は残しておいて、違っている部分だけを消す」という処理方法はPhotoshopのある機能を使えば実現出来るのです。 ノイズはどの写真も微妙に違う花火が写っていない夜空の写真というのは、そんなに欲しいと思わないでしょう。特に必要性が無いのと、簡単に撮影できるからです。 そこで、「普段は写っているけど、写っていないと嬉しいもの」を考えたとき、自分が思いついたのはノイズでした。 都合が良かったのはどの写真のノイズも微妙に違う（ランダム）ということです。 風景はずっと動きませんが（同じ部分）、ノイズだけはバラバラです（違う部分）。つまり、風景が固定されてる写真
デザインの力で行動が変わる！人々を動かす粋なアイデア9選
人の行動を変えなければいけない時、ただ単に口で注意するのと、粋なアイデアで行動を変えさせるのとでは大きく違います。 そこで、今回はデザイン1つで人々の行動を変えた事例を9つほどご紹介します。 プロダクトデザイン編 フェンスを外す人 「フェンスを外す人」という文章をご紹介します。 ここに登場する事例。高級なクラブなどに行くと、灰皿が極端に小さいのはなぜか？ us.christofle.com 小さな灰皿は、一本でもたばこを吸えばいっぱいになってしまう。そうすると、スタッフが灰皿を新しいものに替える。そうするとことで、客への細やかなサービスを演出できるし、スタッフに自然と客へ細かく注目させることを可能にしている。 従業員に「客がタバコを1本吸ったら灰皿を取り替えろ」と言ったり、マニュアルをつくって叩き込めば、問題は一時的には解決されるかもしれません。しかし、灰皿を小さくすることによって、その手
[CSS]素晴らしいテクニックが満載！囲いや区切りなどのラインを実装するスタイルシートのまとめ
divやp、hrなどで実装された囲いや区切りのスタイルに、一手間加えた素敵なデザインにするスタイルシートのテクニックを紹介します。 かわいいデザインからスタイリッシュなものまで、実装のアイデアが素晴らしいものばかりです。
![[CSS]素晴らしいテクニックが満載！囲いや区切りなどのラインを実装するスタイルシートのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/a545d68e72312cfa64f79c7d1932afa3d3078686/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201404%2F2014120205-19.png)
デザインの勉強にいい！タイポグラフィの素晴らしいアイデアやインスピレーションのまとめ
デザインのセンスを磨くには、いいものをたくさん見ること。 タイポグラフィ（主にWeb）の素晴らしいアイデアやインスピレーションが満載のサイトを紹介します。 Discover.typography Gothamなどのフォントをリリースしている「Hoefler & Co.」のフォントギャラリー。自社フォントの使用例がかっこよく掲載されており、各アイテムに使用されているフォントをフォーカスすると、同じフォントを使ったものがハイライトされます。 Beautiful web type combinations 数多くあるGoogle Web Fontsの中から高品質なフォントを厳選し、組み合わせて使用したギャラリー。各テキストをホバーすると、タイプフェイスの名前が表示され、Google Web Fontsにリンクされているのですぐに利用できます。
ウェブ制作者がチェックしておきたいアイデア満載のUIを備えたウェブデザインのまとめ -2014年上半期
うまくトレンドを取り入れ、デザインの細部まで徹底的にこだわり、気持ちのいいインタラクションとアイデア満載のUIを備えた素晴らしいウェブサイトを紹介します。 画像の一部だけ動くシネマグラフを使ったコンテンツ、ペルソナを使ったユーザー中心のレイアウトなど、最新のトレンド情報もお見逃しなく！ VOTD.tv シンプルですっきりしたデザインだけでも素敵ですが、ロゴ、ナビゲーションやサムネイルやコンテンツなどの随所に仕掛けたインタラクションの芸が非常に細かく、楽しませてくれます。
誰でも「おまかせ」でフォトブックを作れるサービスの裏側が、人力と想いにあふれていて熱い | ライフハッカー・ジャパン
たぶん、これ以上にカンタンなフォトブックサービス、ありません。 撮りためた写真を整理、活用する方法としてフォトブックサービスが盛り上がっています。でも、いざ作ろうと思ってみたらレイアウトが面倒だったり、写真が多すぎてどれにするか迷ったりして、挫折してしまった方もいるのでは。 今回紹介する「おまかせ！フォトブック」は、そんな挫折をした方にぴったりのサービス。写真の選定やレイアウトはすべて「おまかせ」で、やることはたった2つ。フォトブックに入れたい写真をサイトからアップロード（または専用のUSBメモリにコピーして郵送）すること、表紙のパターンを選ぶこと、それだけです（詳しくはこちら）。 フォトブック挫折組の上司Yさんに勧めてみた 「おまかせ」を不安に思うかもしれませんが、まずは完成品を見てみてください。以下は「興味はあったけどレイアウトが面倒で、時間もないから試せなかった」という、ワーキングマ
ウェブのデザインやアイデアによい刺激をうける日本のウェブサイトのまとめ
いつもは海外のウェブサイトをテーマごとにまとめて紹介していますが、たまには日本のもと思い、まとめてみました。 デザインやアイデアによい刺激をうける国産のウェブサイトを紹介します。 海外のも定期的にまとめています。 面白いアイデアを使った最近のウェブサイトのまとめ -2014年3月 デザインや仕掛けが素晴らしいウェブサイトのまとめ -2014年1月 MIDORI AOYAMA DJ/プロデューサー Midori Aoyama氏のサイト。フラット・スクロールの定番のトレンドに斜めのグリッド、ポリゴン、アニメーションなど最新のデザインが非常にかっこいいです。制作会社はLETTERS, INC.で、今日リニューアルしたばっか！
ウェブ制作者はチェックしておきたい、面白いアイデアを使った最近のウェブサイトのまとめ
デザインの細かいところまでこだわりが！ こんな発想はどこから生まれるの？ そんな次のプロジェクトのヒントになるような面白いアイデア満載のウェブサイトを紹介します。 時間のある時にじっくり楽しんでください！
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Amazingly Simple Graphic Design Software – Canva
13 Vegetables That Magically Regrow Themselves
ウェブデザインのセンスを磨こう！ 2014年洗練されたディテールのUIデザインのまとめ
https://diycozyhome.com/moss-graffiti/
2014年のロゴデザインのトレンド -2014 Logo Trend Report