Figmaでマスク作成。うまくできないときや解除の仕方。 2024.08.10 Figmaでのマスクのかけ方。 FigmaのマスクはIllustratorやPhotoshopと少し違う。 イラレと違い、フォトショとも違う。 Figmaのマスクのかけ方は、Illustratorのクリッピングマスクと違い、Photoshopのクリッピングマスクともちょっと違う。 オブジェクトと重ね順。 FigmaやIllustrator、Photoshopで... Figmamemosデザイン
UI3 Figma Slidesの使い方やテンプレートの基本。シンプル版。 2024.07.21 Figma Slidesとは? Figma Slides。スライドがテンプレートから作れる。 Figma Slidesの使い方について。 Figma Slidesは現在ベータ版として用意されており、アカウントがあれば2025年初頭まで無料で使用が可能。 使い方はシンプルで直感的。 使い方は簡単で、テンプレートなのですぐに慣れる。 スライド画面のサイズはモ... FigmamemosWebデザインデザイン
UI3。Figmaの新しいUIで、Webやスライド、UI/UXをデザイン。 2024.07.20 UI3というFigmaのインターフェイス。 FigmaのUI3ベータ版に。 FigmaのUI3ウェイティングリストから。 ウェイティングリストに登録していたFigmaのUI3が、ベータ版として使用可能となっている。 (※スクショはダークモード時のもの。) UI3と従来のUIの違い。 数週間か数ヶ月ほど前から、左側のサイドバーにあるデフォルトのタブ... memosWebデザインデザイン
Figmaでデザインされた有名なWebサイトの例。デザインシステムも。 2024.06.28 FigmaでデザインされたWebサイト。 Figmaでデザインされたサイトの判断。 このサイトはFigmaでデザインしている? 現代ではさまざまなデザインツールが普及している。 そのため、Webサイトの見た目だけで、使用しているデザインツールを特定するのは難しい。 またFigmaには、WordPressやWix、STUDIO、Canvaなどのような、Webサイ... FigmamemosWebデザイン
生成AIとWebデザイン、ChatGPTを活用したコーディングに必要なもの。 2024.06.12 生成AIとデザインの交差点。 AIと画像生成・イラスト生成。これからの創作。 AI生成のテクノロジーと、アナログ作業の創造性。 すでにAI(人工知能)は、さまざまな分野で急速に進化しており、デザインの世界もその例外ではなくなった。 その中でも特に注目されているのが、OpenAIの生成AI、ChatGPT。 AIのイメージを超えた性能。 当... AIChatGPTmemosデザイン
Figmaでぼかしをかける方法。写真にぼかしを入れたいとき。 2024.05.24 Figmaのエフェクト機能でぼかし。 Figmaには4種類のエフェクトがある。 Figmaにデフォルトで備わっているエフェクトは下記の4種類。 インナーシャドウ ドロップシャドウ レイヤーブラー 背景のぼかし (※「ブラー(Blur)」は日本語で「ぼかし」の意味。) この中の、「レイヤーブラー」と「背景のぼかし」で、写真にぼかしをかけることができる。... Figmamemosデザイン
Figmaのカラーパレットプラグインの使い方と、70:25:5の配色法則。 2024.05.16 カラーパレットと色相環。 色相環ベースのカラーパレット。 Color Wheel デザイナーは色彩を適切に選択し、調和のあるカラーパレットを作成することが求められる。 そんなときに便利なのが、Web上で色相環を基にカラーパレットを作れるジェネレーター。 参照:https://www.figma.com/ja-jp/color-wheel Color ... FigmamemosWebデザインデザイン
Figmaの解像度は? 計算に便利なサイトやプラグイン。 2024.03.15 Figmaで作成する画像の解像度。 Fifmaからエクスポートしたデザインデータは72ppiになる。 Fifmaは元々Web向け。 FifmaはWebデザイン、Webアプリに適したツールなので、書き出したデザインの解像度はデフォルトで72ppiとなる。 IllustratorやPhotoshopのように、解像度の設定や変更をすることもできない。 印刷物には一工... Figmamemosデザイン
Figmaのクイックアクションバー。開き方と使い方とショートカット。 2024.03.14 Figmaのクイックアクションバーの開き方。 覚えると便利なクイックアクションバー。 開き方。 「メインメニュー(Main menu)」 > 「クイックアクション...(Quick actions...)」と進む。 または、下記のショートカットから開く。 Figmaのクイックアクションバーの使い方。 クイックアクションバーで検索。 ... Figmamemosデザイン
フリーランスHubへ掲載。Figmaで名刺を作ってみたら。 2023.09.23 フリーランスHub。 Figma作った名刺が。 フリーランスHubへ。 Figmaで名刺を作ってみた結果を公開していたところ、一例としてフリーランスHubさまで掲載していただけることに。 名刺制作の参考として。 CHIBA DESIGN(チバデザイン)さまによる名刺デザインのコツや、株式会社山櫻さまによるQRコードのメリットについての記事などと一緒に、ふらっと... DTPデザインFigmamemosデザイン
Adobe Fireflyの使い方例。商用利用可、著作権フリーな画像生成AI。 2023.03.28 Adobe Fireflyとは? 画像生成AIと文章生成AI。 Adobeによる、画像生成AI。 Stable Diffusionがすごい、DALL·Eがやばい、ChatGPTがとんでもない、というハイスピードなAI新時代に、デザインツールの大御所と言えるAdobe社がいよいよ本格参入。 無料で使えるプランもある。 参照元:Adobe ... AIFireflymemos脳
FigmaとAI Genius。レイアウト作成、UI/UXデザインを一緒に。 2023.02.19 GeniusをAI仲間に、Figmaでデザインを。 AIの勢いが止まらない。 デザインツール「Figma」にも、AIのデザイン・コンパニオンがやってくる。 開発元のDiagram社のサイト上で公開されている動画によると、「Companion(コンパニオン)」という名の通り、付き添う仲間や友、連れ、という役割をしてくれる様子。 ざっくりとデザインを考えているときなどに... AIFigmamemosデザイン
Illustrator 「クロスと重なり」の使い方。簡単操作が作業効率を上げる! 2023.02.18 クロスと重なりとは? 「クロスと重なり」機能の登場で、デザインでよく使う、オブジェクトの重ね方が一瞬でできるようになった。 例えば、オリンピックの五輪マークのようなデザインをしたいときなどは、とても便利にできる。 以前はハサミツールでパスを切ったり、切ったオブジェクトを同じ場所に重ねたりと、色々と合わせ技が必要だったが、「クロスと重なり」はその作業を短縮させられる。 ... Illustratormemosデザイン
Illustratorの「スケッチをベクターに変換」を実際にやってみた手順。 2023.02.17 手書きのスケッチをベクターデータへ変換。 「スケッチをベクターに変換」の機能は、その名の通り、ペンや鉛筆などで描いたスケッチのJPGやPNG画像をベクター化することができる。 ずっと欲しかった機能で、ありそうでなかった。使い方は簡単で、数ステップで可能。 アートボードにJPGやPNGなどを配置する。 今回はボールペンで描いたエッフェル塔のスケッチをスキャンし... Illustratormemosデザイン
Figmaがもし有料化されたら。Next Figmaのデザインツール。Pixso。 2023.01.10 Pixso。Figmaがもし有料化されたら。 無料プランでも使えるFigma。 Adobe社からの買収と撤回により、いつかFigmaも有料化されるのでは?と内心不安を抱えている人たちは、結構いるのではないだろうか。 例えば、 初心者の方や学習中の方たちが、ちょっと使ってみたいな、というとき。 職場ではAdobeのプランがあるけど、自宅にないと不便だな、というと... Figmamemosデザイン
Photopeaの使い方や主な機能。Photoshopのような無料ツール。 2022.12.22 Photoshopなどでちょこっとだけ画像編集したくなったとき。 無料プランで使えるオンライン画像編集ツール「Photopea」。 ちょっとした画像編集作業をしたくなったとき、このパソコンにPhotoshopが入っていればなぁ、と思うことがある。 しかしPhotoshopはなかなか高価であり、単発や短時間の作業ではコスパが良くない。 そういうときに、ブラウザ上で無料... memosデザイン
Figmaで名刺を作ってみた結果。作成・入稿・仕上がりまで。 2022.12.06 Figmaで名刺を作成、印刷してみたところ、無事に完成。 FigmaでDTP。 Figmaで名刺? デザインツール「Figma」で、紙媒体の名刺を作って実際に発注し、仕上がりを確認してみた。 Figmaを印刷用に工夫。 単位やカラーモード、ファイル形式などを印刷用に。 Figmaは元々デジタルデバイス向けなので、単位がpxオンリー、カラー... DTPデザインFigmamemos
Figmaでモザイクをかける方法。Pixelsでさらっと簡単に。 2022.12.01 Figmaのモザイクプラグイン「Pixels」とは? Pixelsで画像にモザイクを。 写真や文字にモザイクをかけたいとき。 ネット上などに写真や画像をアップする際、個人情報や特定の箇所にモザイクをかけたいことがある。 Figmaにはデフォルトでは備わっていないようなので、こういうときはプラグイン。 Pixelsでモザイクをかけられる。 プラグインを探し... Figmamemos
Figmaで名刺印刷。グラフィックで実際に発注、PDF入稿してみた手順。 2022.11.28 グラフィック(印刷の通販グラフィック)の名刺発注の手順。 近年ユーザーが増えているFigma。基本的にWeb向けのツールだが、名刺くらいは作れそうなので、実験的に自分の名刺で実際に作ってみた。 印刷は長年定期的に利用しているグラフィックさんへ発注。 参考:Figmaで名刺を作る方法。印刷用設定からCMYK化、入稿前の仕上げまで。 参考:Figma... DTPデザインFigmamemos
Figmaで名刺を作る方法。印刷用設定からCMYK化、入稿前の仕上げまで。 2022.11.25 Figmaで印刷物を。名刺を作ってみる。 Figmaで印刷物。 Figmaで紙媒体、DTPデザイン。 デジタルデバイス向けのデザインツール「Figma」で、紙媒体の名刺を作れるらしい。 それなら試しにと、ひとまず自分用の名刺を制作。 Figmaで名刺制作。 Figmaは印刷物でよく使用するテキストのカーニングやアウトライン化も可能... DTPデザインFigmamemos