タグ

デザインに関するshaseのブックマーク (18)

  • 最先端のデザイン!フラットデザインをサイトに導入する方法 | LISKUL

    ひと昔のサイトを見た時、直感的に「このサイト古いつくりだから、アクティブじゃない」なんて感じることはありませんか? 近い将来、あなたのサイトもこのように思われてしまうかも知れません。サイトのデザインが古いことは、機会損失につながります。 あなたのサイトが少しでも長く愛されるサイトデザインにするために、日は最新のウェブデザイン手法である「フラットデザイン」についてお伝えします。 ▼目次 1.フラットデザイン概要 2.フラットデザインのメリット 3.フラットデザインの考え方 -ロゴマーク -フォントの選定 -オブジェクトの作り方 -グリッドのマージンの取り方 4.背景に画像を敷く 5.フラットデザインなサイト事例 6.フラットデザインなスマホサイト事例 7.まとめ 1.フラットデザイン概要近年、IOS7やwindows8のヴィジュアルに「フラットデザイン」というものが導入されています。歴史

    最先端のデザイン!フラットデザインをサイトに導入する方法 | LISKUL
  • wm_apabtest-4844

    今のあなたのスマホには、いくつのアプリがダウンロードされていますか? 日人のスマホにインストールされているアプリは平均36個、過去30日に使用したアプリの数は8個、インストールしている有料平均アプリは18個だそうです。 (参考:アプリマーケティング研究所|世界各国のアプリ平均保有数、スマホ普及率、検索エンジン・SNS利用率まとめ-「Our Mobile Planet2013」) 昨年末発表された、アプリ調査会社アップアニーの調査でも、日のユーザーによるスマホやタブレット端末向けのアプリの売上高が、アメリカを抜いて世界1位(2013年10月時点)となり、日のスマホアプリの市場がとても成長していることが分かります。 (参考:アプリマーケティング研究所|世界で一番稼いでいるのはパズドラとLINE!App Annieによる2013年のアプリ市場9つのトレンド-D2CRアプリセミナー) アプリ

    wm_apabtest-4844
  • 地域活性化×Webサービス最新事例10選│ITで地方創生を実現! | LISKUL

    アベノミクスの影響でよく目にするようになった「地域活性化」ですが、具体的にどんなことが行われているのか、実はよく分かっていない、なんてことはありませんか? 今回は、Webサービスを駆使した地域活性化にフォーカスして、10の最新事例をご紹介します。 地域の魅力を引き出すヒントがたくさん詰まっていますので、ぜひ、お住まいの地域を思い浮かべながらご覧ください。 【地方代理店向け】観光客誘致・入札案件の攻略法 デジタル施策編【eBook】 大衆の力をWebで集めて町おこし!な事例【事例1】クリエイターによるオープンコンペ 石垣島の「USIO Design Project」 「USIO Design Project」は、デザインの力を通して、石垣島の魅力を再発見するプロジェクト。 (中略) 目指すのは、海の「潮」のように人が行き来し、「潮目」のように豊かな交点を生み出すこと。 石垣・東京・台北の3拠

    地域活性化×Webサービス最新事例10選│ITで地方創生を実現! | LISKUL
  • 【バナーデザインの教科書】訴求したいイメージ別|王道デザイン8選! | LISKUL

    「どうすればこの商材の魅力を最大限に伝えるバナーができるの?」 このような悩みを持つデザイナーさんはたくさんいらっしゃると思います。 よくある「バナーデザインまとめ」のようなサイトを閲覧してもイメージ別のデザイン(配色やフォント)の特徴が見えず、毎回まとめサイトを参考にしていると作業がなかなか進まず、イライラすることもあるでしょう。 そんな方のために今回は訴求したいイメージ別のバナーデザインの特徴をお教えます。 「安心感や信頼感」「誠実さ」「かわいい」「お得感」「先進性」など訴求したいイメージごとに最適なフォントや配色、その他の特徴をまとめて紹介していますので、ご自身が制作したいバナーのイメージに合わせてご覧下さい。 コンバージョンする!高品質なバナー作成方法 【はじめに】デザインイメージ図今回は日カラーデザイン研究所の配色イメージスケール図をベースとしてイメージ別のバナーデザインをまと

    【バナーデザインの教科書】訴求したいイメージ別|王道デザイン8選! | LISKUL
  • 初心者でも「45分」で作れる! 高品質バナーの作り方! | LISKUL

    広告バナーって「ひとつや2つくらいすぐできるだろう」と思っていても案外時間がかかってしまいますよね。 Webサイト制作と同じように配色やレイアウトなどの一つひとつに迷ってしまう方も多いと思います。 実は私も最近までバナーを制作するのに2時間以上かかっていました。しかし「どうすれば速く簡単にバナーを作るのか」を繰り返し試行錯誤する中でやっと見つけたのがこの方法です。この方法を身につければ誰でも1時間足らずで効果の高いバナーを量産することができると思います。 各制作ステップの見出しの横に実際にその作業にかかった時間も記載していますので、これをひとつの制作時間の目安として参考にしてください。 またこれまでに公開しているバナーの基ルールやレイアウトの記事も紹介しておりますので、そちらも合わせてご覧いただけるとバナーに関する理解も深まると思います。 コンバージョンする!高品質なバナー作成方法 そも

    初心者でも「45分」で作れる! 高品質バナーの作り方! | LISKUL
  • 配色はセンスではなくテクニック!ここだけは押さえておきたい3原則 | LISKUL

    ウェブサイトの作成やパワーポイントのスライドなど、デザイナーでなくても配色を決めなければいけないシーンは多くあります。 配色を自分で決めようとすると、なんだかしっくりこない、これが正しい配色なのか分からないと感じている方も多いのではないでしょうか? しかし、3つの原則をおさえて、無料ツールを使えば、ノンデザイナーでも簡単に調和のとれた配色ができるのです。 今回は、下のモノクロのコーポレートサイトの構成に、実際に配色を決めていく事例を紹介いたします。 ▼配色前の企業サイトのレイアウト 【原則1】 メインとなるカラーを1色選ぶ!はじめに、全体の印象を決めることになる、メインカラーを決めましょう。 メインカラーを決める色が持つ印象をおさえた上で、メインカラーを決めましょう。 色の持つイメージをうまく利用することで、伝えたいメッセージが伝わりやすくなります。 今回の事例では、知的で誠実な印象を与え

    配色はセンスではなくテクニック!ここだけは押さえておきたい3原則 | LISKUL
  • グッドデザイン賞を獲得した7つのサイトから学ぶ、ウェブデザインの12のテクニック | LISKUL

    photo by Robert S. Donovanウェブデザインを担当していると、星の数ほどある他のサイトたちに自社のサイトが埋もれてしまわないか、心配になりますよね。 そこで、ユーザーに評判のよいサイトを作るために、プロデザイナーたちから優秀だと認められたサイトデザインを参考にしてみるのはいかがでしょうか? この記事では、2013~2011年の3年間にグッドデザイン賞に選ばれたウェブサイト7つから、自社サイトに活かしたい12個のデザインテクニックをまとめて紹介いたします。 受賞作品を参考に、ヒットするウェブサイトを作りましょう! 参考:BtoB製造業のWebサイト参考事例9選と、ホームページ作成の3つのポイント グッドデザイン賞とは?1957年に創設された日で唯一の総合的なデザイン賞で、毎年企業やデザイナーから40,000件以上の応募があり、よいデザインを示す賞として広く親しまれてい

    グッドデザイン賞を獲得した7つのサイトから学ぶ、ウェブデザインの12のテクニック | LISKUL
  • 【保存版】作りたいイメージ別!ランディングページ 「デザインの指南書」 | LISKUL

    どうすれば「リッチな」印象のページになる? ランディングページの製作時、デザインを「こんな印象のページにしたい」というのはあっても、いざ「どんな配色で」「どんなフォントで」「どの程度の派手さで」を決めるとなると、一体どうやったら自社のターゲットに適したデザインに仕上がるのか分からない! ということはありませんか? 今回は、「可愛らしい」「真面目で冷静な」「先進的な」「信頼感のある」といったイメージ・印象ごとに、適した配色・フォント等デザインを実際のサイトを例に出してご紹介します。 あなたの「こんな印象を与えたい」という思いをデザインにするとこうなる! というのを具体的にまとめていますので、デザインの方針を立てる上での参考にしてください。 ※ランディングページ改善に重要な要素を大きく4つに分け(ファーストビュー、ライティング、導線、その他のポイント)それぞれの項目で訴求ポイントのチェックが行

    【保存版】作りたいイメージ別!ランディングページ 「デザインの指南書」 | LISKUL
  • 16個の業種別で学ぶ「ホームページデザイン」の王道パターン | LISKUL

    ホームページのデザインっていろいろあって、どれが自分のビジネスにふさわしいものか迷ったことはありませんか? 個人で事業をやっている方だと、そのような疑問を持つ方も多いのではないでしょうか。 でも実は、業種ごとの王道デザインを知っていれば悩む必要なんて何もないのです。 今回は、全16業種にわたる王道のホームページデザインをお伝えしたいと思います。 外注を活用したホームページデザインの業務切り出しフロー 1. 美容院のホームページデザイン【王道】 おしゃれな髪型の女性の大きめな写真を載せるデザイン 【実例】 Nine9 / ナイン MerryLand 美容室 pukka hair 美容院のホームページデザイン ポイント「おしゃれな髪型をしている女性の写真を載せる」 美容院のホームページの王道デザインは、お店のロゴが左上、メニューがその横にあり、その下には、おしゃれな髪形をしている女性の大き目な

    16個の業種別で学ぶ「ホームページデザイン」の王道パターン | LISKUL
  • フリーフォント22選【日本語対応/商用可/無料】

    最初から入っている標準フォントだけでは、ブログの画像にキャプションを入れたいとき、WEBサイトのメリハリを付けたいとき、ロゴを作りたいときなど、かっこがつかない!そんなふうに思うことありますよね。 しかしフリーフォントって、あまりに種類がたくさんありすぎて、どれを使っていいのやら困ってしまいがち。欧文フォントは種類も豊富だけれど、日語対応(漢字も対応)フォントを探し出すのはひと苦労。 そこで!今回は使うだけでサイトや印刷物がかっこよく仕上がる、そんな日語フリーフォントをご紹介いたします。 誰でも自由に無料ダウンロード!商用利用も可日語対応上記を満たすフォントの中でも、特にクオリティが高く、様々なシーンで使用できそうなフォントを中心に集めました。(参考:サイト改善 10のポイント) 誰でも上手いキャッチコピーが作れる!ノウハウ記事17選とテクニック集 1.  スタイリッシュにまとめたい

    フリーフォント22選【日本語対応/商用可/無料】
  • 11個の要点でちゃんと理解する「ブランディングってなんなのよ?」 | LISKUL

    あなたは「ブランディングってなに?」と聞かれて、自信を持って答えられるでしょうか? マーケティングに関わる人はよく聞く言葉だと思いますが、人によって理解が違っていることも多く、ちゃんと他人に説明できる人は少ないのではないでしょうか。 ブランディングは、正しくおこなうことで長期的な利益を得られる、企業の飛躍にとってとても重要な戦略です。しかし、そもそもブランディングを正しく理解できていないと、間違ったことに時間とお金と労力を割くことになってしまいます。 この記事では「ブランドの定義」を理解し、ブランディングとはどういうものなのか、どのようにするのかを要約してご紹介します。 1. ブランディングとは簡単に言うと、「共通のイメージをユーザーに持たせる手法の総称」です。 名前、ロゴ、コピー、ポジショニングや製品デザインなどはすべて、あるブランドに対して共通のイメージを持たせる手法=ブランディングの

    11個の要点でちゃんと理解する「ブランディングってなんなのよ?」 | LISKUL
  • 優れたユーザインタフェースを設計する際に考慮する8つのポイント

    ユーザーにとって有益なユーザインタフェースを設計する際に考慮する8つのポイントをUsability Postから紹介します。 8 Characteristics Of Successful User Interfaces 以下、その意訳です。 ユーザインターフェイスの設計時に、考慮する8つのポイントを紹介します。 Clear Concise Familiar Responsive Consistent Attractive Efficient Forgiving To conclude… 1. Clear 明快 明快であるというのは、最も重量な要素です。 ユーザインターフェイスデザインの目的は、ユーザーに意味と機能を伝え、利用するアプリケーションと相互につきあえるようにすることです。そのアプリケーションがどのように機能するのか、どこに進むべきか理解することができない時は、ユーザーは困惑しが

  • いいデザイナーになるために参考になる50サイト – creamu

    dzineblogで、いいデザイナーになるために参考になるサイトがたくさん紹介されています。 ざっといくつかご紹介。 チュートリアル » Tutorial9 » Photoshop Lady » HV Designs » Tutorial Dog デザインフォーラム » Designers Talk » Graphic design forum コミュニティー » Humble Voice » Deviant Art » Carbonmade デザインブログ » Design Melt Down » A list Apart » Design Mag 有名なものからちょっとマイナーなものまで、よくまとまっていますね。 ぜひ見てみてください。 » 50 Sites That Will Help You To Become a Better Designer MacBookのスピーカーの音がよ

  • ウェブデザインのクオリティをアップする7つのポイント | コリス

    ウェブデザインのクオリティをアップする7つのポイントをFunction Web Design & Developmentから紹介します。 How to Spot Quality within Web Design: Examples & Tips 以下、その意訳です。 1. Spacing スペースは、デザインされたエレメントの間に使用される巧妙なテクニックです。素晴らしいイメージを配置することも大切ですが、そのエレメントにどのようにスペースを与えるか充分に考慮する必要があります。 充分なスペース

  • ウェブデザインにおける効果的な背景の使い方

    Backgrounds In Web Design: Examples And Best Practices 以下、その意訳です。 ウェブデザインのスタイルは常に進化しており、大きな変化の一つに背景の使い方があります。 背景の重要な役割は、ウェブサイトへの興味を視覚的にひきつけることです。 背景はウェブサイトのテーマを支えるものであり、あらゆる可能性を考慮し設計を行う必要があります。 ここではウェブデザインの最近のトレンドをふまえた、背景のベストプラクティスを紹介します。 1. The Basic Background Structures 良い背景を設計する際に、背景の基構造を知る必要があります。 Body Background bodyの背景は、昔から使用されている背景です。 主にイメージ、イラスト、テクスチャ、パターンなどを使用します。 Content Background コンテ

  • 大塚製薬株式会社 Otsuka Pharmaceutical

    病気を治すこと。健康を守ること。 大塚製薬は「人々の健康をカラダ全体で考える」 トータルヘルスケアカンパニーです。

    大塚製薬株式会社 Otsuka Pharmaceutical
  • Web Design Trends: Call To Action Buttons - Freelance Web Design Belfast Northern Ireland Lee Munroe's Blog & Portfolio

    Professional and innovative freelance web designer based in Belfast Northern Ireland. I specialise in creative standards compliant web design and I blog about web design - Web Design Trends: Call To Action ButtonsCall to action buttons are the buttons that you, as a web designer, want all your users to click on when they land on your page. Usually they’ll be a link to a download, signup or sale

    shase
    shase 2009/01/07
    ボタン
  • CSSデザイン格付けサイトいろいろ - GIGAZINE

    CSSでデザインされたサイトを集めた「csstux」は、CSSを使ってかっこよくデザインされたサイトがいろいろノミネートされており、それぞれにトラックバックを送ったり、コメントを付けたりすることが可能です。また、各サイトはレートによる格付けがされているので、人気の高いデザインがどれなのかもすぐにわかるようになっています。 これ以外にも同様のサイトはいろいろあるので、知る限りのCSSデザイン格付けサイトをまとめてみました。ウェブデザインの際の参考になるのではないかと。 今回最初に紹介する「csstux」はこれらのCSSデザイン格付けサイトの中ではかなり新参の部類なので、知らない人も多いのではないかと。 以下のフォームから自分のサイトをノミネートさせることも可能です。 csstux - Submit your site 2つめは「CSSElite」 ノミネートするには以下のページに書いてあるメ

    CSSデザイン格付けサイトいろいろ - GIGAZINE
  • 1