Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Monthly Archives: 2月 2017

[Logo Design] Logobook – ロゴやシンボル、トレードマークのデザインギャラリー

  • Pocket
  • このエントリーをはてなブックマークに追加

既存の企業ロゴや、シンボル、トレードマークの類を集めたデザインギャラリー。各ロゴは、文字ロゴ、シェイプによる属性分け、オブジェクト、自然物、ビジネスといったカテゴリで分けて紹介されており、それぞれの詳細画面に入ると、そのロゴが何のロゴであるのか、業種、デザイナー、作られた年といった情報を見る事ができます。掲載点数はかなり多く、また60年代〜80年代にかけて制作された比較的古いロゴが多いです。伝統的なロゴデザインのデータベースとしても有用なサイトといった印象。古めのロゴ大好きな人や、伝統的な手法を愛すデザイナーにオススメです。

[Web Design] 19 Mind-Blowing CodePen Experiments – CodePenのぶっ飛んだ作例まとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

CodePenに上がっているぶっ飛んだ作例をまとめた記事。全部で19の作例が紹介されてるけど、どれもスゴいです。よくこんなの作るなーと感心するものばかり。各作例はEmbededされた形で掲載されているので、動くものをこの1ページで全部見る事ができます。BB-8超かわいい。

[Web App] Taskade – オンラインで共有できるToDoリスト

  • Pocket
  • このエントリーをはてなブックマークに追加

タスクをToDoリスト化し、それを固有のURLを使って他者と共有できるWebサービス。タイトルを付けて本文エリアに入力すると、チェックボックス付きのリスト化されるので、あとはそれをToDoリストとして使えばオッケー。他者への共有リンクは、見るだけのものと編集まで行えるものの2種類生成されるので、都合の良い方を人に伝えればイイみたい。テーマ変更やキーボードショートカット、Chrome Extensionなども用意されていて地味に多機能です。チームで仕事する時とか、毎日の買い物メモなんかに使えそうです。

[Misc] Minimal Directory – ミニマルデザインの製品ギャラリー

  • Pocket
  • このエントリーをはてなブックマークに追加

ミニマルなデザインのハードウェアを集めたギャラリーサイト。用途やメーカーに関係なく横断的に様々な製品が紹介されています。クリックする事で製品を大きく表示でき、写真クリックでオフィシャルサイトでより詳細な情報を見ることができます。良く言えばデザイナーが好みそうな感じ、悪く言えば意識高い系の人も好みそうな感じのもの、といった印象。ちなみにわたくし最近BRAUNの壁掛け時計買いました。意識はとっても低い系なんですけどね。

[CSS] Creating Non-Rectangular Headers – 長方形じゃないヘッダーの作り方色々

  • Pocket
  • このエントリーをはてなブックマークに追加

最近流行りの、長方形じゃないエッジを持つヘッダーの作り方が複数紹介されてます。斜めヘッダーだけでなく、ギザギザや円形なども用意されてます。imageを使う手法、SVGを使うもの、clip-pathを使うもの、border-radiusを使うもの、transform: skewを使うものが紹介されており、最後にそれぞれのメリットデメリットをまとめてある点がとってもナイス。border-radiusを使って円形にするってのは新しいなーと思いました。

[Web Design] WebGradients – CSSで行うグラデーション指定のギャラリー

  • Pocket
  • このエントリーをはてなブックマークに追加

かっちょいいグラデーション指定をサクっとコピペできるサイト。各パレットの右下にある「Copy CSS」をクリックすると、グラデーション描画のためのbackground-image指定をコピーできます。後は貼り付けるだけ。簡単! また各パレットで使われている2色のHEX指定と、PNGのダウンロード機能もあります。用意されているカラーパレットも、いかにも最近な感じでオシャレな作例が多いです。2色考えるのめんどくせぇよ、とかいう乱暴なあなたに是非。

[Web Design] Website Template Bar – 様々なWebテンプレートをまとめたサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

Webテンプレートを各種まとめたサイト。プレーンなHTML5ベースのものに加え、Bootstrapベースのテーマ、Wordpressのテーマ、eコマースに使えるものがそれぞれカテゴリ分けされて紹介されています。最近じゃフレームワークにBootstrap使って、その上にテーマ置いて、そこからデザインカスタム始める事もよくありますしね。ちなみに自分はBootstrap v3によく使うJSやら機能拡張のCSSぶち込んだものをテンプレートみたいに使ってます。テーマ的なものはあまり使った事ないんだけど、このサイト見ると結構いろんなテーマがあるので、テーマぶち込んで楽するのもアリだなーと思いました。