田口 冬菜
田口 冬菜

necco note

画像をレトロな印刷風に加工できるFigmaプラグイン「Halftones」を使ってみた

  • Design

レトロで紙っぽい写真加工ができるFigmaプラグイン「Halftones」を使ってみました。

プラグインをインストールしてすぐ使えるので、ウェブやUIのデザインで雰囲気ある写真を使いたいときに便利です。写真の画質が低いときにも役立つかもしれません。

この記事では、Halftonesの使い方や作例を紹介していきます。

Halftonesとは?

HalftonesはFigmaで使えるプラグインです。

写真を用意して少し操作するだけで、レトロな印刷物のようにドット柄のパターン効果をかけてくれます。ドットの形や荒さも調整できるので、雰囲気のあるオシャレな画像をつくりたいときに便利です。

Halftonesのインストールはこちらから

使用方法

FigmaでHalftonesを使用するときの手順は以下です。

  1. Figma Community からプラグインをインストール
  2. Figmaを開いてパターンを適用したい画像を用意
  3. Dots または Halftones を選び、お好みで効果を調整

ドットの加減は好みで変えられるので、いろいろ試してみてください。

Halftonesを使った作例

実際にHalftonesをつかって写真を加工してみました。

左が加工前のオリジナル画像、真ん中がHalftone効果を適用した画像、右がDotted効果を適用した画像です。

加工前のオリジナル画像全体像。

Halftone

Halftone効果を適用した画像。
小さめのドットフィルターをかけてみました。
彩度は自動で高くなり、全体に明るく発色のいいイメージになりました。

ドットをより荒くしたバージョン。
画質が悪い写真でも、このフィルターをかければ雰囲気ある写真に生まれ変われるかもしれないですね。

Dotted

Dotted効果を適用した画像。
紙に白黒で印刷したようなイメージになりました。
新聞紙や大正・昭和っぽいレトロなイメージ表現をしたいときに使えそうです。

ドットをもっと荒くしたバージョン。
紙っぽい質感がより強くなりました。

Halftonesでの作例一覧

作例の一覧です。
同じ写真でもHalftonesの効果次第でイメージが変わっておもしろいです。

まとめ:レトロな紙っぽい雰囲気加工ができた

Figmaで使えるプラグイン「Halftones」の紹介でした。

実際に使ってみると、操作方法は簡単ながらも場面に応じてモードの使い分けでき、レトロなイメージの写真加工が気軽にできてよかったです。

プラグインをインストールしてしまえばいつでも効果が試せるので、今後も気軽に活用していきたいです。


📮 お仕事のご依頼やご相談、お待ちしております。

お仕事のご依頼やご相談は、お問い合わせ からお願いいたします。

🤝 一緒に働きませんか?

下記の職種を募集中です。より良いデザイン、言葉、エンジニアリングをチームで追求していける方をお待ちしております。詳細は 採用情報 をご覧ください。

  • フロントエンドエンジニア

🗒 会社案内資料もご活用ください。

弊社のサービスや制作・活動実績、会社概要、ご契約など各種情報をまとめた資料をご用意しています。会社案内資料 からダウンロード可能ですので、ぜひご活用ください。

株式会社necco ダウンロード資料へのバナー画像

(2024年5月時点)

田口 冬菜

田口 冬菜

Fuyuna Taguchi

三重県伊勢市生まれ。地元の二次救急病院で約6年間理学療法士として約6年働き、趣味ではじめたデザインにハマってデザイナーへ転職。転職のタイミングでより成長できる環境を求めて東京に引っ越し。都内のデザイン会社1社を経て、2020年からneccoに入社した。入社後にはモーションデザインのスキルを身につけ、現在デザイナー・モーションデザイナーとして働いている。個人ではブログを書いたり、たまに動画・映像関連のメディア出演をしたりしている。著書に『これからはじめるFigma WebUIデザイン入門』(マイナビ出版、2022)がある。インテリア、本、コーヒー、あまいもの、散歩、人の姿勢・動作観察が好き。

SHARE

Other Note

necco note

課題図書『Typographic Systems 美しい文字レイアウト、8つのシステム』を読んで学んだこと