BLOG

文字を強調するWebデザイン12選+バナー応用例
投稿日:2022年10月5日

『このバナーのココの文字、強調して』 ディレクターやクライアントからこう指示されたら、 Webデザイナーの皆さんならどうデザインしますか? 動画以外では、基本的に画像+テキストで情報を伝えるWebサイト。 魅力的な情報でないと、読んではもらえません。 文字を強調して大切な文節だ ...

【Webデザイン】100サイトのOGP画像を調査し傾向をまとめました
投稿日:2022年8月30日

SNSでWebサイトを共有するときに、より注目してもらうために重要なのが「OGP画像」です。 サイトに合わせた適切なOGP画像を設定することで、SNS上でのキャッチーさや、サイトに対するイメージを視覚的にアピールすることができます。 今回は100のウェブサイトの画像を調査し、コーポレ ...

比較表・料金表を分かりやすくデザインするポイント+スマホ対応例
投稿日:2022年8月10日

Webデザインでは、サービス内容や料金の違いをユーザーに分かりやすく見せるために 比較表、料金表を作成することがあります。 他社との違いを比較できたり、 複数プランの特徴や料金が理解しやすく Webサイトのコンバージョン率のアップにつながる重要な役割があります。 比較表のデ ...

【Webデザイン】コーポレートサイトの見出しに使える適切な英語表現
投稿日:2022年7月12日

あなたがWebデザイナーなら… コーポレートサイトの見出しタイトルのデザイン装飾に、またはナビゲーションに、 おしゃれに見える英語表現を入れたこと、ないですか? ゴシック体の日本語で野暮ったく見えてしまう見出しも、 装飾として適度な『英語』を取り入れれば、 一気にカッコよくて洗 ...

【2022年版】無料アイコン素材サイト13選【商用利用可能】
投稿日:2022年6月7日

忙しい作業に追われる毎日、アイコンの手描きは難しい…そんな方に、 ハイクオリティで使いやすいアイコン素材をすぐに利用することができれば、 とっても心強いですよね。 そこで、無料で商用利用OKでクレジット表記不要なアイコンが探せるサイトを 今回は13サイト選んでみました。 ぜひブ ...

コーポレートサイト・ECサイト・ランディングページ、デザインの違いをまとめてみた
投稿日:2022年5月11日

BRISKに入社する以前のお話ですが… 筆者がWeb制作会社に入社して1週間、突きつけられた専門用語。 「人材派遣サイトのLPのワイヤーフレーム作って」 未経験で入社した新人Webデザイナーだった筆者は右も左もわからず 「え・・エルピーってなんですか?」と聞き返しました…。 ...

脱!初心者デザイン~バナー編~
投稿日:2022年4月28日

WEBデザインに欠かせないバナー、デザイナーであれば一度は作成したことがあるのではないでしょうか? デザインを勉強する際にバナーのトレースやバナーの作成から始めた人も多く、 デザイナーの登竜門といってもいいかもしれませんね。 ですが、簡単そうに見えて作成に慣れていないとリテイク&迷走の沼に ...

【最新v8】Swiperの使い方・実用的なデモ15個の解説 ー基礎から応用までー
投稿日:2022年4月27日

Webサイトのコーディングをするなら必修とも言えるスライダー。 スライダー実装用のJSプラグインはいろいろありますが、本記事ではその中でもSwiperを使用した実用的なカスタマイズ例をご紹介します。 デモページを見る まずはこちらのデモページをご覧ください。 片方だけはみ出しているスライ ...

【ロゴ作成のコツまとめ!】ロゴの種類と作成の流れを解説!
投稿日:2022年3月29日

「初めてのロゴ制作、何から手を付けたらいいのかわからない...」 「会社の名前を覚えてもらいたい!というクライアントの要望に応えるロゴにするには?」 このようなことでお悩みの方向けに、本記事では、ロゴの種類と作成の流れを解説いたします! 種類と流れだけでなく、興味深いロゴの歴史やロ ...

【最新版】手抜き厳禁!パンくずリスト・フッターのデザイン参考まとめ
投稿日:2022年1月12日

たかがパンくずリスト。たかがフッター。 そう思ってはいませんか? どちらもユーザビリティを考慮して見やすくデザインする必要のある、 シンプルだからこそ、プロのセンスが問われるパーツデザインなのです。 パンくずリストってそもそもどこに設置したらいいの…? フッターも手抜きしたくな ...

インフォグラフィックとは?ゼロから作成まで徹底解説!
投稿日:2022年1月11日

みなさんは「インフォグラフィック」という単語を聞いて何を思い浮かべますか? この単語を聞いたことのある方は「あれだな!」と、ピンとくると思います。 聞いたことのない人は単語から推測して、「イラストを使ったものかな?」などと想像するかもしれません。 本記事ではインフォグラフィックについて ...

【2022年へ向けて】Webデザイン参考サイトまとめ【Web/LP/バナー/SNS広告】
投稿日:2021年12月9日

今年ももう年末を迎えようとしていますね。 オリンピックが開催されたり、ディズニーシーが20周年だったり、今年もいろいろありましたがあっという間でした。 デザイントレンドは年々移り変わっていて、情報収集は欠かせません。 そこで、2022年に向けて、最新のWebデザイン参考サイトを、Web ...

【作業を時短!】一目でわかるPremiere Proのエフェクト集
投稿日:2021年12月3日

Premiere Proで動画を作成していく中で 「こういう動きでシーンチェンジをしたい...」 「テキストも動かしたい...」 と色々動きをつけたくなることは多いですよね。 ですが、そういった動きを付けるのに方法を探すも中々思ったような動きを見つけられず、検索ばかりに時間がかかって ...

【デザインイメージ別】背景パターンの選び方・作例まとめ +無料のパターン素材も紹介!
投稿日:2021年12月2日

今回はデザインに合ったパターン背景の選び方をご紹介します! 「パターンを使ってみたけどしっくりこない」「今のデザインにどんなパターンを使えばよいか分からない」 そんな方のために、デザインイメージ別にさまざまなパターンをご紹介します! サイトに統一感や、アクセントを生み出してくれること間 ...

【2022年 Web/UI】最新のデザイントレンド予測!
投稿日:2021年11月25日

2021年も終わりが近づいていますね。 そこで本記事では、2022年のデザイントレンドを予測したいと思います! 予測だけでなく、解説したり、実際にデザインを作成しているので是非2022年のデザイン作成の 参考にしてみてください。 それではどうぞ! [toc] グラスモーフ ...

デザイナーが最低限知っておくべきWebライティングの基礎
投稿日:2021年11月17日

Webライティングとは? ブログの記事はもちろん、コーポレートサイト・ECサイトなどの文章を、 Webサイトを閲覧しているユーザーに理解しやすく、読みやすく書くことです。 プロのWebライターさんには及ばないものの、 簡単な文章ならリライトしてデザインを整えるのもWebデザイナー ...

Illustrator初心者でも簡単3ステップで描けるアイコン作成
投稿日:2021年11月4日

Webアイコンといえば、ボタンの遷移先を示したり、サービスの内容を簡潔に表したりと、役割は様々。 「文字だけの情報ではユーザーに伝わりにくい…」 「写真素材ばかりでバランスが悪い……」 そんなとき配置するだけで文字の情報量をはるかにしのぐ存在と言えます。 無料で使用できるアイコン ...

もっと知りたい!デザイン知識 ~色・配色編~
もっと知りたい!デザイン知識 ~色・配色編~
投稿日:2021年11月2日

前回紹介した「脱!初心者デザイン」では、配色の基礎を非デザイナーさん向けにまとめました。 前「脱!初心者デザイン~色・配色編~」はこちら 今回はさらに詳しく専門的に配色や色についてご紹介出来たらなと思います。 色相環を元にした配色、トーンを使った配色、色の組み合わせで起きる対比効果 ...

最近流行しているWEBデザインに使用されているイラストを分析!
投稿日:2021年10月27日

最近のWEBサイトではコンテンツのあしらい仕様のほかに、 MVや、キービジュアルにイラストを使用しているサイトも多くみられますよね。 一口にイラストといっても種類は様々で、サイトにあうイラストを作成したいけど、どんなデザインがいいかな? 作るサイトにあうイラストを探すなら、どんなものが ...

ゲシュタルトの7つの法則を理解して使いやすいWebサイトを作ろう!【具体例あり】
投稿日:2021年10月14日

皆さん、ゲシュタルトの法則をご存じでしょうか? ゲシュタルトの法則とは 人間が生まれながらに自然と持っているような感覚、あるいはこれまで生きてきた中でほとんど無意識に育まれてきた共通認識があります。 その感覚に名前を付けて、有効にデザインに取り入れていこうというのがゲシュタルト ...