最適なツールで提案・制作します
Figma / Illustrator / Photoshop




FIGMA
デザインはすべてFigmaで制作し、ブラウザ上でいつでも確認・コメントいただけます。コーディングとの連携がしやすく、Webページの実装まで一貫して対応できるため、デザインの意図を正確に形にします。
Figmaデザインファイルへ
Figmaデザインシステム


WEBデザインは「見た目だけ」整って見えれば良いわけではありません
Figmaは、画像や文字を並べるだけでもデザインを作れます。しかしそれでは、ページが増えたり修正が入ったりするたびに、少しずつズレが生まれてしまいます。
Agario Designでは、ボタンや見出し、ヘッダー・フッターなどのパーツを「コンポーネント」として、文字サイズや色、余白を「スタイル」としてあらかじめ設計。
サイト全体のルールを持ったデザインを制作しています。
Figma制作のメリット
ルールのあるデザインだから、
公開後も崩れません

修正が早い
ボタンや色を1か所直すだけで、全ページに反映されます
ページを増やしても統一感が続く
新しいページも同じパーツで組み立てられます
実装とのズレが少ない
デザインとコーディングを同じ担当者が行うため、「デザインと違う」が起きにくくなります
いつでも確認できる
Figmaのリンクを開けば、PC・スマホの画面をブラウザ上で確認し、そのままコメントできます
こんなデザインに対応しています
コーポレートサイト/採用サイト・採用LP/ランディングページ/ECサイト/バナー・広告画像/ロゴ・名刺・チラシ(Illustrator)/写真のレタッチ・切り抜き(Photoshop)
ヒアリング
目的・ターゲット・参考サイトの確認
サイト構成・ワイヤーフレーム作成
掲載する内容を整理し、ユーザーの動線を考えたサイト構成をワイヤーフレームに落とし込みます。
デザインルールの設計
色・文字・余白・パーツ
トップページのデザイン提案
サイト全体の方向性となるトップページのデザインをご提案し、イメージをすり合わせます。
デザイン制作の流れ

下層ページのデザイン展開
トップページが固まりましたら、そのほかのページをデザインしていきます。
Figma上でご確認・修正
お客様もコメントの書き込みを自由に行うことができ、要望が伝えやすいと好評です。
納品・ウェブサイトへの実装・公開
Html/CSS、WordPress、Studioなどへ実装します。
よくある質問
ご依頼前によくいただくご質問をまとめました。

ご相談・お問い合わせ
Web制作、保守、AI活用のご相談など、まずはお気軽にご連絡ください。
内容がまだ整理できていない段階でも大丈夫です。
Web制作もAI活用も、まずは ご相談から
お問い合わせ内容を確認のうえ、内容に応じてご案内いたします。
ngised.oiraga@ofni
Web制作 / Web保守 / AI活用支援