デザイン

デザインシステムの基本原則を学び、Figmaで効率的なWeb制作方法を初心者にもわかりやすく解説する記事です。

最近AIによる描画ソフトがかなり熱くなっており、その中でも特に「Stable Diffusion」はWeb制作者にとってもインパクトが大きく、使い方によっては制作の役に立つかもしれないと思っています。

Adobe XDで無料のスタータープラン版のダウンロードが困難になりましたが、現時点でダウンロードする方法についてまとめています。

この記事は、Twitterで連載していた「1枚の画像でフォントの特徴と使い方がわかる」に追加の情報を加えて記事にしたものです。
Webデザインを勉強されている方や、フォントの知識を深めたい方に最適な記事です。

emiと申します。USAGI DESIGN emi.というWebサイトでWebデザインやコーディング練習用のデザインデータを配布しています。普段はWebデザインやコーディング、メンターなどをしております。 この記事では、 …

「スマートフォン時代のWebデザインスクール」は、現在動画受講が可能です。初回体験レッスンも受講可能です。

Adobe XDをはじめ、新しいWeb技術やデザインワークフロー、新しい端末などに対応するため、授業内容はリニューアルし新しい内容となっております。

この記事は、以下のような方を対象にしています。 現在Webデザインを仕事にしていて、さらにデザイン力をつけたい方 今はプログラマー、ディレクター、コーダーなどデザイン以外の仕事をしていて、来年はデザインも手がけたい方 ※ …

以前、Webクリエイターボックスの「世界のWebデザイナーのお給料はいかほど？」という記事が話題になっていました。
「他の国とくらべて日本のWebデザイナーの年収は低すぎる」とか「海外に脱出するしかない」と嘆いている方がかなりいらっしゃったようですが、こういう見方もありますよ、ということで記事にまとめました。

正直タイトルの時点でひどすぎると感じていますし、このような記事を書くのは本望ではないのですが、これを許してはいけない、受け入れるわけにはいかないという気持ちがどうしてもありますので記事を書くことにしました。

Web制作で以前から気になっていたことについて、Twitter の投票機能でアンケートを取ってみました。
それぞれの項目について、解説も書いています。

Webデザイン制作で使用するアプリは多様化しており、これからWeb制作をはじめたい方にはどれを選べば良いか分かりにくいかもしれません。
この記事では、Photoshop、Illustrator、XD、Sketchに絞り、それらのアプリケーションの特徴についてまとめています。

この書籍は完全所初心者ではなく、PhotoshopやIllustratorをある程度使える方向けの本となっております。
「Webデザインスクールや他の入門書などで基本操作はわかったけれどさらにステップアップしたい方」、「普段Web制作をしているが最近のAdobe CCの新機能をキャッチアップできていない方」などに良いのではと思います。

Illustratorで何かを制作したいという方にとって最初の関門は、おそらくペンツールで曲線を描くことではないでしょうか。
ペンツールの動作はお世辞にも直感的とは言えず初めて使う方は戸惑うことが多いと思います。
しかし、たった一つのことを頭に入れて作業するだけで、初めての方でもある程度自分が描きたい曲線が描けるようになると思います。

Photoshopで画像を制作している時、ぼかした色の境界が暗くなったり濁った色や不自然な色になってしまうことがあります。 また、他の方が制作したデータでカラー設定を合わせているはずなのに境界部分の色が変わってしまうとい …

クライアントから頂いたデータがWordやPowerPoint形式だった、あるいはテキストだと思って頂いたデータが画像文字だったということは残念ながらあるかもしれません。
この記事では、どうすればWordやPowerPoint形式のデータから画像を取り出したり、画像文字をテキストに変換できるかということについて書いています。

Web制作で以前から気になっていたことについて、Twitter の投票機能でアンケートを取ってみました。
アンケートの実施期間は2017年1月〜8月です。

Adobe Illustrator CC はマイナーアップデートでしたが、Web制作者にとっては嬉しい機能も追加されたため紹介します。

DOCTYPE宣言はHTML5かXHTMLか、IEはどのバージョンまでサポートするか、RetinaディスプレイのPhotoshopでカンバスサイズはどうしているかなど、Web制作で気になっていたことをアンケートで調べてみました。

この記事は、2014年10月に発売された27インチの「iMac Retina 5Kディスプレイモデル」のレビューです。
これまで、自宅で作業する時は MacBook Air に Apple Cinema Display 20インチを接続して作業していましたが、それとは比べものにならないほど快適で、「もっと早く買えばよかった」と思っています。

遅ればせながら、2014年8月にこのブログのスマートフォン対応を行いました。
この記事では、その際に考えたことや工夫したことなどをまとめています。

普段PhotoshopでWebデザイン制作をされている方でも、意外とできないことがあって悩んでいたり、効率のよいやり方がわからず困っていることがあるかもしれません。

この授業では、事前に「PhotoshopでWebデザイン制作するときの悩み」を投稿していただき、スクーの授業にて、その解決方法を実際の操作を交えながら生放送でお話しします。

2014年7月16日に、Google と Adobe がリリースした Noto Sansというオープンソースのフォントファミリーは「日本のWebデザイン史上に残る画期的なフォント」だと思ったので記事にしました。

この記事は、Photoshop CC 2014 の新機能をWebデザイナー視点からまとめた記事です。
6月19日の「Adobe Create Now 2014」および、6月23日の「アドビ 報道関係者向けCreative Cloud 最新製品 デモセッション」で聞いた話を含みます。

Photoshop で段落テキストを作成する時、数値を指定して作成するのは地味に面倒だったりします。
そこで、「長方形選択ツール」などで選択範囲を作成し、実行するとアンチエイリアスなしの段落テキストを作成するスクリプト（JSX）を作成しました。

SVG は Illustrator で書き出すことができますが、これまで Photoshop ではプラグインなどを使わなければ SVG を書き出すことができませんでした。
しかし、Photoshop CCの「画像アセット」機能を使用して SVG を書き出す裏技を見つけたので紹介します。

これからPhotoshopでWebデザインを始めたい方から現役Webデザイナーの方向け。
Fireworks からの乗り換えの方向けの記事からより速く制作するためのテクニック、Adobe が開発中の CSS をコピーしたり画像アセットをダウンロードするためのWebアプリなど。

2013/9/9 に、Adobe Photoshop CC がバージョン 14.1 にアップデートされました。
アップデートされた機能の中で、Web制作者にとって重要なのは画像アセット（Generator）機能だと思います。
この記事では、Generatorの使い方、使ったほうが良いケースと使わないほうが良いケース、問題点やバグなどについて解説しています。

私が iPadを購入してから1年経ちました。想像以上に使い道が多くて毎日のように活用しています。
以前は自炊＆電子書籍ビューアについて解説しましたが、今回はWebデザインで活用しているアプリについて解説したいと思います。

Adobe Illustrator CCと、Dreamweaver CCの新機能とバグのまとめ記事です。
Illustrator CC の新機能とバグについては、主に Illustrator Mania というサイトの管理人であり、Illustrator のお祭り dot-ai にも出演された鈴木さんにお話いただきました。

私が執筆した「プロになるためのWebデザイン入門講座　実践で役立つPhotoshop＆Illustrator徹底ガイド」が7月24日に技術評論社より発売されました。
この記事では、書籍の内容について詳しく解説しています。

Adobe Photoshop CC がようやく公開されたので、早速レポートです。
Photoshop CCは、見た目はほぼ Photoshop CS6 と同じですが、パネルを使用したシェイプサイズの変更や角丸の再編集など、Webデザイナーにとっても地味に便利な機能が追加されています。

Fireworks からの移行先アプリケーションの候補の1つである Photoshop について、Twitterを見ていると「Photoshop でのWebデザインは制作効率が悪い」という方が多いようですが、私はそんなことはないと思っています。
なぜそう言えるのかについて、簡単にまとめてみました。

4/11（木）21:00より、schoo（スクー）というオンライン動画スクールで「Webデザインの基礎と実習」という講座を3週連続で行ないます。
生放送には Ustream を使用しており、どなたも無料で視聴頂けます。

PhotoshopでWebデザインカンプなどを制作している方にはかなり役立つ、「シェイプを移動・変形・複製」するJSXをアップデートし、シェイプを移動・変形・複製する際に、まれに数値のズレが発生するバグを修正しました。 …

「Photoshop を使ってみたいけど高すぎる」と思っている皆様は、「月額 ¥2,200 で最新の Photoshop を利用できる」ということはご存知でしょうか。
これは、アカデミック（学生向け）ライセンスではなく、どなたでも利用でき、もちろん Adobe が提供する正規のライセンス です。