web design trends

Webに関わるすべての人のためのメディア

「源ノ明朝」とは?AdobeがGoogleと共同開発したオープンソースフォントを使ってみよう

2017年4月3日にAdobeから、「源ノ明朝」と呼ばれるオープンソースフォントが公開されました。オープンソースフォントなので誰でも無料でダウンロード、商用利用することが可能です。 意外と明朝フォント… Continue Reading →

ついにデザインツール「STUDIO」のβ版がリリース!注目機能をまとめて紹介!

株式会社オハコからUIデザインツール「STUDIO」のβ版が公開されました。STUDIOはSketchやAdobe XDのように、WebページやアプリのUIデザイン作成のためのツールです。 2017年… Continue Reading →

国産プロトタイプツール「Prott」の特徴やメリットなど

プロトタイプとは、作成した画面のデザインを、擬似的に動くように組み立てて、その表示のされ方や動きを確認するために作成するモックアップのようなものです。 今ではプロトタイピングツールはIT業界では欠かせ… Continue Reading →

洗練されたミニマルデザインへ。パララックスやアニメーションを活用する方法

ミニマルデザインは、デザインから余分なものを取り除くことで、シンプルでおしゃれなWebサイトに仕上げることができるデザイン手法です。 見た目もシンプルで、簡単に作れるのではと思ってしまいがちですが、た… Continue Reading →

【2017年3月】Adobe XDが大幅アップデート!PhotoshopやIllustratorとの連携機能も

2017年3月のアップデートでAdobe XDとPhotoshop,Illustratorとの連携機能が追加されました。 その他にも様々な機能が追加され、UIデザインツールとしての使い勝手が大きく向上… Continue Reading →

知らないとまずい!最近話題の「コンテンツマーケティング」とは

コンテンツマーケティングという言葉を聞いたことはありますか?古くから存在しているマーケティングの手法ですが、スマホ端末の普及やSNSの人気などが影響し、改めて最近その効果が注目されています。 今回は、… Continue Reading →

プロトタイピングツール「inVision」はここまで進化した

プロトタイピングツールは、実際にウェブ制作を行う前にモックを作成し、完成形をイメージしやすくするためには欠かせないツールです。 今回は、プロトタイピングツールとして世界で大きなシェアを誇る「inVis… Continue Reading →

必見!Web制作に役立つサービス・ツールまとめ

一口にWebデザインと言っても、ベースのデザインを作成する所からコーディングまで様々な工程があり、色々なサービスやツールを使って制作が行われています。 今回は、実際にデザイン制作の現場で役立つような、… Continue Reading →

Adobeが発表!2017年のWebデザイントレンド予測

Adobeといえば数々のデザインツールを提供している、デザイナーであれば知らない人がいないであろう有名な企業です。 そんなAdobeがThe Future is Now: 10 Design Pred… Continue Reading →

多様なサービスが開発可能な「Ruby on Rails」とは?

クックパッドやマネーフォワードなど、主要なWebサービスの開発にも使われているRuby on Railsですが、比較的新しいフレームワークだということもあり、プログラミング初心者には一体どのようなもの… Continue Reading →

チームでの共同作業にぴったりのデザインツール「Figma」とは

Figma(フィグマ)とは、ブラウザ上で作業することができるデザインツールです。 競合にはSketchやAdobe XDなどがすでに人気を占めていますが、Figmaにしかない機能もたくさんあり、一部で… Continue Reading →

コピペで実装!すぐに使えるCSSサンプルコードまとめ

ボタンや見出しなど、Webデザインの核となるパーツに関するCSSサンプルコードが紹介されているページをまとめました。 想像以上に優れたデザインが多数紹介されていて、中には難しいコードも紹介されています… Continue Reading →

SketchからAdobe XDに乗り換えた方がいい理由

Adobe XDは、SketchがUIデザインツールの主流となりつつある中で、2016年に突如登場したUIデザインツールです。 PhotoshopやIllustratorなどのメジャーなツールを提供し… Continue Reading →

収益アップ!ネイティブ広告の特徴とサービスまとめ

ネイティブ広告とは、関連コンテンツの中に表示されている広告です。関連記事広告や、関連コンテンツ広告と呼ばれたりもします。 最近ではネイティブ広告を掲載しているサイトも増えてきていて、今後の広告掲載のス… Continue Reading →

IconJarを使ってアイコンの管理を完璧にする

Webデザインをしているとアイコン素材を使うことが多いと思いますが、アイコン素材の管理はきちんと行っていますか? おそらく多くの方が管理が行き届いていなかったり、管理できていたとしても手間だと思ってい… Continue Reading →

人気のアイコンフォントとその使い方を紹介!

アイコンフォントはWebデザインやコーディングを行う上でお世話になることが多いですよね。 一度使ってみるとその便利さに気づくのですが、初めて使うときはよく分からないと思っている人も多いのではないでしょ… Continue Reading →

最近流行りの「枠線」を使ったページデザインの特徴

最近、ページの周りを枠線で囲ったようなデザインのWebサイトをよく見かけるようになりました。 ページに枠線を付けることで、ページ全体の印象が締まったものになり、少し違った印象のページを作ることができま… Continue Reading →

コピペで実装!スプリットスクリーンレイアウトのサンプルコード

スプリットスクリーンレイアウトとは、画面を大きく分割して表示するデザイン手法です。 分割するため対比を表現したい場合に使われたり、画面の片側をメニューのようなガイド表示に使用する場合も多いですね。 今… Continue Reading →

デザインの参考にしたいWebサイトまとめ【2017年2月】

2017年2月に見つけた、デザインの参考になるWebサイトをまとめました。 どのサイトもしっかりと作り込まれていて、細部の細かい演出まで参考になるので、ぜひご自身でもチェックしてみてください。 RID… Continue Reading →

おすすめ!マテリアルデザインのフレームワークやUIキットまとめ

マテリアルデザインはGoogleによって発表されたデザインの考え方と手法です。 マテリアルデザインはユーザビリティを考えたデザインということが特徴で、シンプルかつ分かりやすいデザインを作成することが可… Continue Reading →

簡単きれい!Webデザインの「配色」に役立つサービス

Webデザインを行う際に気をつけなければいけないポイントの1つが配色です。どんな色を使うかによってページの雰囲気やイメージが大きく変わります。 芸大や美大でしっかりと勉強をしたような人は知識が叩き込ま… Continue Reading →

SEO対策に欠かせないオンラインツールまとめ

SEO対策については色々な書籍やページで紹介されていますが、SEO対策に必要なツールについては実はあまり知られていない場合が多いです。 SEO対策を行う上でツールやサービスの活用は欠かせません。 今回… Continue Reading →

パララックスを使い倒す!おすすめのjQueryプラグインまとめ

パララックス(視差効果)を実装することのできるプラグインは様々あり、用途によって最適なプラグインも異なります。 今回は、パララックスを実装するためのjQueryプラグインについて、おすすめのものに厳選… Continue Reading →

Web制作におすすめ!人気のCSSフレームワークまとめ

Web制作におけるCSSフレームワークとは、デザインやレイアウトのカタログのようなものです。 ページのベースとなる部分はCSSフレームワークに任せてしまうことができるので、作業時間を大幅に短縮すること… Continue Reading →

© 2017 web design trends