HHiROs Studio

Web版フォトエディタ(試験運転中)

Web版フォトエディタは、インストール不要・登録不要・無料で使える、ブラウザだけで動く画像編集ソフトです。写真の補正、文字入れ、レイヤーを使った合成、PSDファイルの読み込みなど、本格的な編集機能をそろえています。テンプレートからSNS投稿やチラシを作ったり、AIで人物だけを切り抜いたりもできます。パソコンのほか、AndroidやタブレットのブラウザでもPWA(ホーム画面に追加して、アプリのように使う方式)として使えます。

いまは試験運転中です。使いながら見つかった不具合やご希望は、お問い合わせからお知らせください。

アプリを開く →

Web版フォトエディタの編集画面。インスタ投稿のテンプレートにパフェの写真が入り、右にレイヤーの一覧がある
編集画面。左がツール、右がレイヤー、上がメニューと、ツールごとの設定です。写真は、テンプレート「インスタ投稿(新メニュー)」に入れたところです。

こんな方に

主な機能

テンプレートから作る

「ファイル」→「テンプレートから作成…」で、インスタ投稿、インスタのストーリー、YouTubeのサムネイル、お店のチラシ(A4)、Xの投稿のひな形を開けます。写真の枠が選ばれた状態で開くので、「画像を配置…」で写真を選ぶと、枠にぴったり収まります。文字は、文字ツールでクリックして打ち直すだけです。

テンプレートから作成の画面。インスタ投稿、インスタのストーリー、YouTubeのサムネイル、お店のチラシ、Xの投稿の5つが並んでいる
テンプレートの一覧。選ぶと、新しいタブで開きます。

AIで人物を切り抜く

「選択」→「人物を選択(AI)」で、写真の中の人物を、AIが自動で選びます。「人物だけを残す(背景を隠す)」を選ぶと、背景がマスクで隠れ、透明なPNGで保存できます。AIは、お使いのブラウザの中で動くので、写真はどこにも送られません(はじめて使うときに、AIのプログラムを読み込みます)。

人物だけを残した写真。背景が透明になり、レイヤーにマスクが付いている
「人物だけを残す」を使ったところ。背景はマスクで隠しているので、あとから直せます。

描く・消す・選ぶ

ブラシ、消しゴム、塗りつぶし、スポイトを使って描けます。ブラシは、鉛筆・マーカー・エアブラシ・チョーク・スプレー・星のスタンプ・万年筆・網点などのプリセットから選べ、自分の設定を「マイブラシ」として保存できます。種類は、通常、ぼかし、指先、覆い焼き、焼き込み、スタンプ(コピー元を決めて複製)です。形や間隔、散布、紙・布目・網点などのテクスチャも設定でき、ペンを使う場合は、筆圧でサイズや濃さを変えられます。選択ツールは、矩形、楕円、投げ縄、多角形、マグネット投げ縄、自動選択があり、トリミングや自由変形もできます。

レイヤー

画像や文字をレイヤーに分けて、重ねて編集できます。不透明度、描画モード、レイヤーマスク(白で描くと表示、黒で隠す)、レイヤーのグループ化とリンクに対応しています。調整レイヤー(明るさ、色相・彩度、レベル補正、階調の反転、白黒、二階調化、ポスタリゼーション)を使うと、元の画像を傷つけずに色を直せ、あとから設定を変えられます。

色の調整とフィルター

画像メニューから、明るさ・コントラスト、色相・彩度・明度、レベル補正、トーンカーブ(RGBとR/G/Bの曲線を編集)、階調の反転、白黒、二階調化、ポスタリゼーションが使えます。画像の回転(90°・180°)と反転もできます。フィルターは、ぼかし(ガウス)、シャープ、ノイズ、モザイクです。

文字

フォントは、標準のフォント、Google Fonts、HiROs Studio のオリジナルフォント「HiROs ポップ」、そしてこのPCに入っているフォントから選べます(パソコンの Chrome・Edge で一覧を読み込めます。ほかのブラウザでは、フォント名を入力します)。サイズ、太字、斜体、下線、取り消し線、縦書き、揃え、文字間、行間、ワープに対応しています。文字を曲線に沿わせる「パス沿い」もできます。レイヤースタイルで、境界線、ドロップシャドウ、シャドウ(内側)、光彩、ベベルとエンボス、サテン、カラーオーバーレイ、グラデーションオーバーレイ、パターンオーバーレイを付けられます。

図形・グラデーション・定規

四角(角丸)、楕円、直線を描けます。グラデーションは、線形、円形、角度、反射です。定規とガイドで、位置をそろえたり、数値で指定したりできます。

新規作成のひな形・タブ・保存

新規作成では、YouTube・SNS・印刷(はがき、名刺、写真のL判など)・スマホ向けの大きさを、一覧から選べます。複数の画像を、タブで同時に開けます。開いているタブは自動で保存され、次に開いたときに、そのまま復元されます。作業の途中は「プロジェクトを保存」で、ファイルとして残せます。

読み込み・書き出し

PSDファイルを読み込めます(レイヤー、不透明度、描画モード、マスクを保ちます)。書き出しは、PNG、JPG、WEBP、AVIF(対応ブラウザのみ)、GIF、BMP、ICO、TIFF、TGA、PPM、DDS、RAW、SVG(画像を埋め込んだ形式)、PDF、PSDに対応しています。

表示は、日本語と英語を切り替えられます。

基本の使い方

  1. 画像を開く: 「ファイル」→「画像を開く…」で、画像を開きます。「新規作成…」で白い画面から始めたり、「テンプレートから作成…」で、ひな形から始めたりもできます。
  2. 見る位置を変える: Ctrl+ホイールで拡大・縮小、Spaceを押しながらドラッグで移動します。タッチ操作では、2本指のピンチと移動です。
  3. 色を直す: 「画像」メニューの色調補正を使うか、レイヤーメニューで「調整レイヤーを追加」を選びます。調整レイヤーなら、あとから、やり直せます。
  4. 文字を入れる: 文字ツール(T)を選び、画面をクリックして入力します。フォントや大きさは、上の設定で変えられます。
  5. 一部だけ加工する: 選択ツールで範囲を選び、フィルターや色の調整をかけると、その範囲だけに効きます。人物なら「選択」→「人物を選択(AI)」が便利です。
  6. 書き出す: 「ファイル」→「書き出し…」で、形式を選んで保存します。続きの作業をするときは、PSDで書き出すか、「プロジェクトを保存」すると、レイヤーが残ります。

間違えたときは、Ctrl+Zで取り消し、Ctrl+Shift+Zでやり直しです。

主なキー操作

操作キー
移動 / ブラシ / 消しゴム / 塗りつぶし / スポイト / 手のひらV / B / E / G / I / H
ブラシの大きさ[ と ]
前景色と背景色の入れ替え / 初期色X / D
矩形選択 / 楕円選択 / 投げ縄 / 自動選択M / O / L / W
トリミング / 自由変形C / Ctrl+T
すべて選択 / 選択解除 / 選択反転Ctrl+A / Ctrl+D / Ctrl+Shift+I
新規レイヤー / 選択範囲をレイヤーにコピーCtrl+Shift+N / Ctrl+J
プロジェクトを保存Ctrl+S
取り消し / やり直しCtrl+Z / Ctrl+Shift+Z

よくある質問

無料ですか? 登録は必要ですか?

無料で、登録も要りません。ブラウザで開くだけで使えます。はじめて開いたときに、利用規約への同意をお願いしています。いまは試験運転中のため、予告なく、内容を変えたり、止めたりすることがあります。

画像は、サーバーに送られますか?

画像の編集は、AIでの人物の切り抜きも含めて、お使いのブラウザの中で処理されます。編集中の画像が、HiROs Studioのサーバーへ送られることは、ありません。ただし、フォントにGoogle Fontsを選んだときは、フォントのデータを、Googleの配信元から読み込みます。

編集中のデータは、保存されますか?

開いているタブは、お使いのブラウザの中に自動で保存され、次回、復元されます。ただし、ブラウザのデータを消すと失われます。大事な画像は、必ず、ファイルとして書き出すか、プロジェクトとして保存してください。

パソコンに入っているフォントは使えますか?

使えます。フォントの欄で「このPCのフォントを読み込む…」を選ぶと、パソコンに入っているフォントの一覧が出ます(パソコンの Chrome・Edge。はじめてのときは、ブラウザが許可を求めます)。フォントの一覧は、ブラウザの中にだけ覚えておき、どこにも送りません。

スマートフォンでも使えますか?

使えます。2本指のピンチとドラッグで、拡大と移動ができます。Androidでは、ブラウザの「ホーム画面に追加」で、アプリのように起動できます。画面が小さいため、細かい作業は、パソコンのほうが向いています。

PSDファイルは、完全に同じ見た目で開けますか?

レイヤー、不透明度、描画モード、マスクなどを保って読み込めますが、元のソフトと完全に同じ見た目になるとは限りません。スマートオブジェクトは、画像のプレビューとして読み込まれ、書き出すときは、スマートオブジェクトになりません。大事なデータは、元のファイルも、残しておいてください。

書き出せない形式はありますか?

MP4、EXR、DXF、EMFには、対応していません。PNG、JPG、WEBP、PDF、PSDなどは、書き出せます。動画は、動画エディタをお使いください。

不具合を見つけました

お問い合わせから、「やった操作」と「起きたこと」を教えてください。使っているブラウザの種類も書いていただけると、助かります。

ご利用にあたって

アプリを開く →