2022.09.09 WEBWebデザイン Photoshopのレイヤー整理術!レイヤーを美しくして作業効率を上げよう! INDEXPhotoshopのレイヤーとはレイヤー整理のポイント3つ1. グループ化する2. レイヤー・グループにわかりやすい名前を付ける3. 無駄なレイヤーを作らないさいごに Photoshopのレイヤーとは PhotoshopやIllustratorなど、グラフィック系のソフトに存在するレイ [...]
2022.07.28 BUSINESS仕事術 意図しない置換・文字化けを防ぐ!PDFにフォントを埋め込む方法 作成したPDFを相手に送ったり、Webページにアップロードをした際、フォントが置き換わっていたり文字化けを起こしていたりしたことはありませんか? それは、PDFにフォントが埋め込まれていないことが原因かもしれません。 PDFにフォントが埋め込まれていないと、ファイルを開く側のユーザーのシステムに同 [...]
2022.07.20 WEBWebデザイン Photoshopのトーンカーブの役割と効果を理解して、画像補正をマスターしよう!【色補正編】 Adobe Photoshopを使って画像の補正を行う際、使用する頻度が高い「トーンカーブ」。 前回は明るさの補正の仕方をご紹介しました。 前回の記事はこちらPhotoshopのトーンカーブの役割と効果を理解して、画像補正をマスターしよう!【基本編】 今回は、撮影した写真が特定の色味に偏ってしま [...]
2022.06.30 WEBWebデザイン Photoshopのトーンカーブの役割と効果を理解して、画像補正をマスターしよう!【基本編】 Adobe Photoshopを使って画像の色調補正を行う際、使用する頻度が高い「トーンカーブ」。 対角にある2つの点を繋いだ線をドラック&ドロップでカーブさせることで、画像の明るさやコントラストが変化します。 皆さんはトーンカーブがなぜこのような形状をしているのか、考えたことはあるでしょうか。 [...]
2022.05.31 WEBWebデザイン Photoshopでくもり空を青くしよう!~空の置き換え機能を使わない方法も紹介します~ Adobe Photoshop CC 2021のアップデートにより搭載された「空を置き換え」機能。 Adobe Sensei という人工知能が画像のマスクと合成を自動で行ってくれるという、画期的な機能です。 今回はそんな空の置き換え機能の使い方を、解説していきます。 また、「空を置き換え」機能のな [...]
2022.05.07 WEBWebデザイン Illustratorのブレンドツールを使って、飛び出す文字を作ってみよう! Illustratorのブレンドツールとは、 2つのオブジェクト間に形状を作成して、均等に分布させることができます。2つのオープンパスをブレンドしてオブジェクト間を滑らかに変化させたり、カラーのブレンドとオブジェクトを組み合わせて、オブジェクトの形状内にカラーの変化を付けたりすることもできます。A [...]
2022.03.30 WEBWebデザイン Web制作に役立てよう! フォントに関する便利なオンラインツールをまとめました。 Webサイトや印刷物などのデザインを作る上で「フォント」は欠かせません。 私はよく、電車の広告や街中の看板などに使われているフォントを観察しています。観察していると、世の中には数多くの種類のフォントが存在しているなと感動します。 デザインする上で、フォントの影響力は多大です。フォントの種類を変える [...]
2022.01.31 WEBWebデザイン 【Photoshop】ブラシ機能の基本的な使い方から活用方法まで Photoshopのブラシは、サイズやエッジの柔らかさ、デザインを変えて画面内を自由にペイントできるほか、選択範囲を調整するなどペイント以外の用途でも役立ちます。 今回はブラシ機能の基本から活用方法までをご紹介します。 ※説明には、Adobe Photoshop CC2021(Windows10版 [...]
2021.12.27 WEBWebデザイン Photoshopのアクション機能とバッチ機能を活用して、画像処理を自動化(一括処理)しよう! Photoshopにて、画像のリサイズやトリミングなど、簡単な作業を繰り返していると、「もっと効率よく画像を処理したい」と思うことがあります。 そんな時には、Photoshopの「アクション機能」と「バッチ機能」が便利です。 それぞれを簡単に説明すると、 アクション機能…Photoshop上での連 [...]
2021.11.26 BUSINESS仕事効率化ツール Googleスプレッドシートの「条件つき書式」「カスタム数式」を使って、チーム内での効率的な進捗管理を! 私の日々の業務の一つに、お客様に代わってwebページをCMSで作成する作業があります。ときには1サイト300ページを超える大規模なサイトの移行・改修を請け負うことも。 作業はチーム(複数人)で行うため、進捗管理が欠かせません。どのページがどこまで作成されているのかを一目で確認する必要があります。 [...]
2021.10.27 WEBWebデザイン WebP形式の画像をPhotoshopで読み込み・編集・書き出しができる!プラグイン「WebPShop」の導入方法をご紹介 WebPとはJPEGやPNG・GIFなど代表的な3種類の形式と比べて画像の圧縮率が高く、アルファチャンネル(透過)にも対応している汎用性が高い画像フォーマットです。 iOS 14/iPadOS 14およびmacOS 11のSafari14で、WebP形式画像が正式にサポートされ、WebPを導入する [...]
2021.09.29 WEBWebデザイン PowerPointがなくても大丈夫! Googleスライドを使ってバナーや画像ボタンを作る方法 前回の記事「画像編集ソフト要らず!パワーポイントを使って簡単にバナーや画像ボタンを作る方法」 では、PowerPointを使った基本的なバナーの作り方をご紹介しました。 前回の記事を執筆した後、「そもそもMicrosoft Officeをインストールしていない人はどうしたらいいのだろう」と思い調べ [...]
2021.08.31 WEBWebデザイン 画像編集ソフト要らず!パワーポイントを使って簡単にバナーや画像ボタンを作る方法 ホームページに掲載したり、web広告に利用したりと、なにかと必要な機会の多いバナー。 ホームページの更新でちょっとしたバナーの文言変更や写真の差し替えがしたいとき、 制作会社に頼むのは面倒だし、費用がかさむ… でもIllustratorやPhotoshopなどの画像編集ソフトは持っていないし、持 [...]
2021.08.03 WEBWebデザイン SVGってなに?PhotoshopやIllustratorでSVG画像を書き出す方法を解説します。 JPGやGIFといった画像拡張子のほかに、「SVG」という拡張子を目にしたことがあると思います。 JPGやGIF等の「ビットマップデータ」とは違い、SVGは「ベクターデータ」に分類されます。ベクターデータには拡大しても画質が落ちないという特徴があり、昨今のwebサイトでは、レスポンシブやRetin [...]
2021.06.29 WEBユーザビリティ・UX・UI アプリ・Webサイトを専門家が評価する「ヒューリスティック評価」とは?【目的・調査・評価方法】 前回のブログにて、ユーザビリティテストについて解説しました。 今回は、ユーザビリティテストと同様に、ユーザーにとって使いやすいWebサイト・アプリを作るのに有効な「ヒューリスティック評価」をご紹介します。 数多く存在するWebサイト・アプリにとって、使い勝手のよさは重要なポイントです。ヒューリステ [...]
2021.06.04 WEBWebデザイン IllustratorデータをPhotoshopで開く! レイヤーを保持したままaiをpsdに変換する方法 Illustratorでの制作物にPhotoshopで効果を付けたいときや、 aiデータをpsdデータに変換する必要があるとき、ただIllustrator上でpsdデータを「開く」をしても、レイヤーは統合されてしまいます。 今回はIllustratorで作成したデータのレイヤーを保持しながら、Ph [...]
2021.05.14 WEBユーザビリティ・UX・UI webサービスやwebサイトの開発・改善に役立つ、ユーザビリティテストとは?【準備から実施・分析までの流れ】 自社のwebサイト・webサービスが、果たしてユーザーのニーズに応えられているのかと不安になったことはありませんか? ユーザビリティテスト(UT)とは、サイトの改善において、実際にサイトのターゲットユーザーに利用してもらい、操作感やサイトの構成に関する課題を発見する手法のことです。開発・制作者の視 [...]