2016.11.15
Webサイトのデザインはもちろん、アプリ開発でもなんでも、アイコンは重要なポイントですよね。自分でデザインするのもいいですが、さくっとフリー素材でアイコンがほしい！という方は、無料でフラットアイコンが手に入る「Icons8」がオススメです。 このサイトは、36,000個以上も用意されているフラットアイコン(フラットデザインで作られたアイコンのこと)を、リンク表記さえすれば無料でダウンロードして使うことができます。カテゴリ分けも細かくされているので探しやすいのと、何より日本語対応しているのが嬉しいですね！ 「Icons8」の使い方 「Icons8」は、サイトにアクセスしたときに最初に表示される検索窓にキーワードを入力、もしくはカテゴリ選択をすることで必要なアイコンを手に入れることができます。
つづきを読む
2016.07.13
Webデザインは、使われる技術もトレンドもどんどん変化します。数年前の流行が更に洗練され、新たなトレンドが作り出されることもあります。 Webデザインのセンスを磨くために、良質なデザインのWebサイトを数多く閲覧して、「何故、このデザインが注目を浴びているのか？」を考えてみましょう。 本日は、いま、Webデザインで取り入れたいトレンドをご紹介します。 高画質の写真・動画を背景に 高品質の写真や、見栄えのいい動画をホームページの背景に表示したデザインは、最近では珍しくなくなりました。 通信速度の向上やモバイル機器の発達、そしてInstagramの普及など、よりクリアで高画質の写真や動画を表示する環境が整ったことと、それを求めるユーザーの傾向が強まっていることが要因として挙げられます。 また、
つづきを読む
2016.06.04
スマートフォンに対応したWebサイトが増えてくるとともに、Webサイトのデータを読み込み中であることを示すローディングアニメーションのデザインや種類も増えてきました。 今日は、ローディングアニメーションのフリー素材で私が可愛いなーと思った「Flat Preloaders」をご紹介します。 Flat Preloadersで配布されているこのローディングアニメーションは、GIFアニメーションの形式のため、ファイルサイズも軽く、気軽に使うことができます。 しかも、フラットデザインで、見た目もとってもおしゃれ！ もちろん、自分でGIFアニメーションでローディングアニメーションを作りたいという方にとっても参考になると思います。 サイズは128x128, 64x64, 32x32の3パターン。 Dow
つづきを読む
2016.03.16
画像を使わずに、HTMLとCSSだけでボタンが作る。 それは、ユーザビリティやSEO、フラットデザイン（起伏のない2Dデザイン）を採用したWebサイト制作などを考えたら非常に理想的ではありますが、自分で一から作ろうとするととても大変ですよね。 そんな時、「2.5dBUTTON」を使えば、マウス操作で簡単にデザインを調整し、HTML+CSSでボタンを作ることができます。 簡単な使い方説明 「2.5dBUTTON」にアクセスをしたら、スクロールダウンすると、サンプルのボタンが表記されたスペースが出てきます。 まずは、表の項目にある「BUTTON LABEL」のスペースに、ボタンの上に表記する文字を打ち込みます。 ボタン上のアイコンは「ICON」で、マウスカーソルを合わせたときのボタンの動きは「
つづきを読む
2016.03.13
ここ最近、トップの画像のようなアイコンを使っているWebサイトを見る機会が増えていると思いませんか？フラットデザインのコンセプトに合わせやすかったり、レスポンシブWebデザインを考えたときにメリットがあったりします。 しかし、このアイコン、画像で用意するといろんなパターンを想定して数種類のサイズを作らなくてはいけなかったり、例えばフリー素材でアイコンを探そうとしてもテイストが統一されたアイコンを探すのはなかなか難しいものです。 そこで、最近、よく使われるようになってきているアイコンフォントをご紹介したいと思います。特に今回は、BootStrapでも使われている「Font Awesome」をご紹介していきます。 アイコンフォントとは 「フォント」と言えば当然、文字の書体や大きさなどを決めた文
つづきを読む
2016.02.22
クオリティの高さとその個性で世界中の注目を集め続けるスイスのデザイン。 今日は、そんなスイスのデザイン、「スイススタイル」について、ご紹介したいと思います。 現在のデザインに繋がる1950年代のスイススタイル スイススタイルは、スイス発祥の、1940年代から1950年代にかけて流行したグラフィックデザインのスタイルのことで、「インターナショナル・タイポグラフィック・スタイル」と呼ばれることもあります。 グリッドとサンセリフ体を組み合わせ、大きな写真とシンプルで小さなフォントで構成されるスイスデザインは、現在流行しているフラットデザイン（起伏のない2Dデザイン）に通じるものがあると言われています。 また、スイススタイルはフォントが重要視されており、1957年にスイスでヘルベチカ体が誕生すると
つづきを読む
2015.04.16
デザインといえば猫も杓子も「フラットデザイン」という風潮がある気がする今日この頃。 フラットデザインは、その定義を明確にすることは難しいですが、グラデーションや影（シャドウ）を使わずに、「フラット」かつシンプルにデザインをしたものを言います。 また、必要最小限の機能に絞って設計する「ミニマルデザイン」などと一緒に考えられることも多くあり、今デザインをするならばフラットデザインの知識は必須といえます。 今日は、そんな「フラットデザインを始めたい！」という受講生向けに、参考になるギャラリーサイトとカラーパレットサイトを紹介したいと思います。 1. MUUUUU.ORG. |フラットデザイン 国内外のフラットデザインのWebサイトを見たい、という場合はこちらのMUUUUU.ORG. のフラットデ
つづきを読む
2015.02.23
米グーグルが毎年開催している、開発者向けイベント「Google I/O」。その2015年版の公式サイトが公開されました。 今年は、5月28日から29日の2日間、米国サンフランシスコで開催し、その様子は例年通りライブストリーミングでも配信されます。 今日は、その公式サイトのデザインに注目していただきたいということで、お話をしたいと思います。 Google I/Oで発表されたデザイン・マニフェスト 昨年のGoogle I/O 2014での発表の中に、「マテリアルデザイン（英： Material Design）」というガイドラインの発表がありました。 マテリアルデザインとは、どんなプラットフォームやデバイスであっても統一感のある体験をユーザーにもたらすことができる、シンプルで明るく、クリアなデザ
つづきを読む
