FigmaからCMYKでエクスポート。画像軽量化プラグイン「TinyImage Compressor」の使い方。 2023.02.27 井川 宜久 TinyImage Compressorプラグインとは? TinyImage Compressorは、Figmaからエクスポートするファイルを軽量化してくれるプラグイン。 Figmaでは現時点サポートされていないCMYKに変換したり、画像形式をWebPなどに変換してくれる。 印刷用にしたい場合はCMYKでPDFのエクスポート、Web用にしたい場合はRGBでWebPに、とい... FigmamemosWebデザインデザインデザインツール
FigmaとAI Genius。レイアウト作成、UI/UXデザインを一緒に。 2023.02.19 井川 宜久 GeniusをAI仲間に、Figmaでデザインを。 AIの勢いが止まらない。 デザインツール「Figma」にも、AIのデザイン・コンパニオンがやってくる。 開発元のDiagram社のサイト上で公開されている動画によると、「Companion(コンパニオン)」という名の通り、付き添う仲間や友、連れ、という役割をしてくれる様子。 ざっくりとデザインを考えているときなどに... AIFigmamemosWebデザインデザインデザインツール脳
FigmaからWebPで書き出しす方法。Olive Pressの使い方 2023.01.16 井川 宜久 Figmaのプラグイン「Olive Press」とは? WebPで書き出すことが増えている。個人的にはWeb用の画像のほとんどは.webp形式を使用している。 現時点、FigmaやIllustratorなどのソフトはデフォルトでWebPは書き出せないが、画像形式を変換できるWebサイトはネット上に多々ある。 また、Figmaのプラグイン「Olive Press」は、Fig... FigmamemosWebデザインデザインデザインツール
Figma プラグインを削除する方法。追加も削除もシンプルに。 2023.01.11 井川 宜久 Figmaへ追加したプラグインを削除したいとき。 Figmaはプラグインのインストールが簡単なので、ついつい色々なものを追加してしまう。 そうしているうちに、数日後、数ヶ月後には、あれ?と、何のためのプラグインだったかがわからなくなってしまったり、増えすぎて探しづらくなってきたりする。 Figmaからプラグインを削除する手順。 プラグインの追... FigmamemosWebデザインデザインデザインツール
Figmaがもし有料化されたら。Next Figmaのデザインツール。Pixso。 2023.01.10 井川 宜久 Pixso。Figmaがもし有料化されたら。 無料プランでも十分に使えるFigma。 Adobe社に買収されてから、いつかFigmaも有料化されるのでは?と内心不安を抱えている人たちは、結構いるのではないだろうか。 例えば、 初心者の方や学習中の方たちが、ちょっと使ってみたいな、というとき。 職場ではAdobeのプランがあるけど、自宅にないと不便だな、というと... FigmamemosWebデザインオンラインツールデザインデザインツール
Figma 削除したファイルを復元したいとき。復元の方法。 2023.01.09 井川 宜久 Figma使用中に削除してしまったファイルを復元したい。 Figmaで作業中に、誤ってファイルを削除してしまうときがある。 ゴミ箱を探しても、残念ながらFigmaにはゴミ箱はない。 焦ってしまうが、ゴミ箱的な場所は存在し、そこから復元することは可能だ。 Figmaの削除ファイルを復元する手順。 「Drafts / 下書き」をクリ... FigmamemosWebデザインデザインデザインツール
Material SymbolsをFigmaへ。インストールしてすぐに使える。 2022.12.16 井川 宜久 GooleのアイコンフォントをFigmaへ。Material Symbols。 Google Fontsから手軽に使えるアイコンフォント「Material Symbols」が、デザインツール「Figma」のプラグインとして配布されている。 Googleの案内では現時点、2,500以上のアイコンが使えるらしい。 かつ「Outlined(輪郭)」、「Rounded(角丸)」、「S... FigmamemosWebデザインオンラインツール
Figmaのルーラー(定規)の出し方。表示方法がイラレとちょっと違う! 2022.12.15 井川 宜久 Figmaのルーラー(定規)は「shift + R」で。 Figmaでデザインをしているときにルーラー(定規)を出そうと「command + R」 or 「Ctrl + R」を押しても出てこない。 あれ!?と思い、じゃあ、と右クリックで出そうとしてもメニューにもない。 IllustratorやPhotoshopで慣れているとつい、「command + R」 or 「Ctr... FigmamemosWebデザインデザイン
Figmaの背景切り抜き方法。ペンツールの使い方とプラグイン。 2022.12.07 井川 宜久 Figmaのペンツールとマスクで、背景から切り抜く。 Illustratorや画像編集ソフトの代表格であるPhotoshopでもそうだが、ペンツールの使い方を覚えておくと後々で役に立つ。 AIの導入などによりPhotoshopの被写体の切り抜き精度が上がっている。ただしうまく切り抜けない時は、今でも結局人の手によるペンツールに頼ることになる。 また、ペンツールはロゴやアイ... DTPFigmamemosWebデザインデザイン
Figmaで名刺を作ってみた結果。作成・入稿・仕上がりまで。 2022.12.06 井川 宜久 Figmaで名刺を作成、印刷してみたところ。 デザインツール「Figma」で、紙媒体の名刺を作って実際に発注し、仕上がりを確認してみた。 Figmaは元々デジタルデバイス向けなので、単位がpxオンリー、カラーモードはRGB、印刷物向けのデータ形式はPDFのみ、などと制限がある。が、工夫すれば問題なく入稿でき、実際の紙に印刷された名刺は特に問題なかった。 た... DTPFigmamemosデザイン
Figmaを日本語化。言語切り替えの使い方。再起動も不要。 2022.12.03 井川 宜久 Figmaを日本語に切り替える方法。MacもWinも使い方は同じ。 2022年のFigmaの日本法人設立により、Figmaはデフォルトで英語⇄日本語の言語切り替えが可能となっている。 特に再起動の必要もなく、早ければ数秒〜数十秒ほどで言語の切り替えができる。 インストール版でもブラウザ版でも手順は同じ。 Figmaの画面右下のhelpマーク(... FigmamemosWebデザインデザイン
Figmaで検索・置換する方法。ショートカットからでOK。 2022.12.02 井川 宜久 Figmaで検索・置換が可能に。 Figmaのアップデートで検索と置換の機能が実装されていた。 ショートカットで検索、置換ができるので、なかなか使い勝手が良い。 使い方は簡単で、以下のショートカットですぐに覚えられる。 ショートカット Mac:「Command」 + 「F」 Win:「Ctrl」 + 「F」 ※「F」は「Find... FigmamemosWebデザインデザイン
Figmaでモザイクをかける方法。Pixelsでさらっと簡単に。 2022.12.01 井川 宜久 Figmaのモザイクプラグイン「Pixels」とは? ネット上に写真や画像をアップする際、個人情報や特定の箇所にモザイクをかけたいことがある。 Figmaにはデフォルトでは備わっていないようなので、プラグインを探してみたところ、「Pixels」というシンプルで素敵なプラグインが見つかった。 Pixelsは、ただモザイクをかけられるだけでなく、ベクター画像としてモザイク処理... FigmamemosWebデザインデザイン
Figmaの印刷データ用プラグイン「Print for Figma」の使い方。 2022.11.29 井川 宜久 Print for Figma。Figmaの印刷用プラグインとは? Figmaはもともとデジタルデバイス向けのツールだが、工夫すればDTPやグラフィックデザインも可能だ。IllustratorやPhotoshopでの知識や経験があればやってやれないことはない。 逆に、Figmaは元々Photoshopを意識して作られたデザインツールなので、カラーパレットやレイヤーなどの機能やイ... DTPFigmamemosデザインデザインツール
Figmaで名刺印刷。グラフィックで実際に発注、PDF入稿してみた手順。 2022.11.28 井川 宜久 グラフィック(印刷の通販グラフィック)の名刺発注の手順。 近年ユーザーが増えているFigma。基本的にWeb向けのツールだが、名刺くらいは作れそうなので、実験的に自分の名刺で実際に作ってみた。 印刷は長年定期的に利用しているグラフィックさんに発注。 参考:Figmaで名刺を作る方法。印刷用設定からCMYK化、入稿前の仕上げまで。 参考:Figmaで名... DTPFigmamemosデザイン
Figmaで名刺を作る方法。印刷用設定からCMYK化、入稿前の仕上げまで。 2022.11.25 井川 宜久 Figmaで印刷物を。名刺を作ってみる。 petsデジタルデバイス向けのデザインツール「Figma」で、紙媒体の名刺を作れるらしい。 Figmaで名刺制作。 ひとまずテストとして自分用の名刺制作を試みる。印刷物でよく使用するテキストのカーニングやアウトライン化も可能で、PDFでの書き出しもできる。 ある程度IllustratorやPhotos... DTPFigmamemosデザイン
Figmaがダークモードに対応。背景色設定も簡単、目に優しい! 2022.09.04 井川 宜久 Figmaがダークモードに対応。 無料プランでも十分に使えるデザインツール「Figma」がついにダークモードに対応している。 以前からブラウザ版では拡張機能の「Dark Reader」で対応できていたが、インストール版でもダークモードでデザインができるようになった。 [affiliate] ※後日追記) petsブラウザ版も同じ手順でダークモー... FigmaIoTmemosWebデザインデザイン
WebP対応。JPGやPNGからの変換も簡単。SEOにも効果的に。 2022.06.21 井川 宜久 WebPの壁、IEが公式にサポート終了。 Internet Explorerがサポート終了に。 いよいよというか、ついにというか、2022.06.16にIEのサポートが終了した。 そこで、改めて画像形式、WebPについて考察してみた。 WebPの開発元であるGoogle社のChromeはもちろん、Apple社のSafariも2020年から対応している。 M... FigmamemosSEOWebデザイン