brunest.studio

Designing Intent.
Coding Purpose.

Designing Intent. Coding Purpose.

Structure/Code/UX

Building Digital Experiences with Clarity and Intention.

SELECTED WORKS

これまでの制作と、できること。

Coding / WordPress / UI Implementation

デザインの意図を汲み取り、使いやすく運用しやすいWebサイトへ実装します。
これまでに携わった制作の中から、いくつかご紹介します。

Contact
Scope
コーディング / WordPress実装を中心に、レスポンシブ・UI実装まで対応。保守・運用を意識した実装を行います。
Stack
HTML / CSS(Sass) / JavaScript / jQuery / PHP / WordPress
Design Support
デザイン意図を汲み取り、仕様の確認・整理や必要に応じたご提案まで対応します。
Design
既存トンマナを活かしたページ展開を中心に、内容に応じてデザインからの一貫対応も可能です。
Contact
Contact

CONCEPT

整理すること。それが私の届け方。

届けるためには、デザインも、コードも、その前にある整理が欠かせません。

クライアントの想い。
ユーザーの期待。
ビジネスの目的。

それぞれを丁寧に整理し、同じ方向へ向けること。
私はそのための対話と構造化を、仕事の軸に置いています。
情報を増やすのではなく、本質を見つけるために。

Structure
情報をただ並べるのではなく、何を、誰に、どの順番で届けるのがベストか。
目的と優先順位を整理し、伝わるための骨格をつくります。
Dialogue
言葉になっている要望だけでなく、その背景にある想いや目的まで。対話を重ねながら、一緒に本質を見つけていきます。
Intent
デザインや言葉に込められた「なぜ」を読み取り、意図まで実装する。
見た目を再現するだけでなく、伝わる体験へつなげます。

PROCESS

考えることと、つくることを、分けない。

聴くことから始め、整理し、形にする。
そして、届けた先まで考える。
その一連のプロセスを、大切にしています。

  1. 01 Listen

    聴く

    言葉になっている要望だけでなく、その背景にある想いや目的まで。
    まずは丁寧に聴き、届けたいものを一緒に整理します。

  2. 02 Structure

    構造化する

    聴いたことを整理し、情報に優先順位をつける。
    何を、誰に、どの順番で届けるか。その骨格を設計します。

  3. 03 Build

    形にする

    デザインや言葉に込められた意図を読み取り、形にする。
    見た目だけでなく、その先の体験まで考えて実装します。

  4. 04 Improve

    育てる

    つくって終わりではなく、届けた先まで。
    使われる中で見えてきた課題と向き合い、より良い形へ育てます。

WORKS

考えたことを、かたちで示す。

担当した範囲は案件ごとに異なります。それぞれで何を考え、どこに手を入れたかを添えました。

View All Works
View All Works

VOICE

制作を通して、いただいた声。

  • デザインから実装まで、
    安心してまとめてお願いできました。

    新サービスの立ち上げに合わせて、急遽コーポレートサイトが必要になったクライアントの制作をお願いしました。予算が限られていたこともあり、細かくデザインを作り込んでから実装する進め方が難しかったため、デザインから実装まで一貫して対応できるMasaさんにご依頼しました。

    これまで、実装を中心にされている方へデザインもお願いした際に、デザイナー目線では調整が必要になることがありました。そのため、今回もデザインと実装の両方を安心して任せられることを重視していました。

    Masaさんはデザイナーとしての経験もお持ちなので、細かなデザインの指示をすべて用意しなくても、安心してお任せできました。
    細部のデザイン・実装にも気を配ってくださり、こちらから修正をお願いすることなく、納得できるクオリティで期日より前に納品できたことが、とてもありがたかったです。

    限られた予算とスケジュールの中で、デザインから実装までまとめて相談でき、安心して制作をお願いできる方です。

    Webディレクター／デザイナー M.Design 加々美 緑 様

    株式会社Minori様のコーポレートサイト制作

SERVICE

デザインを、意図ごと実装する。

制作会社さまの制作フローに、必要な部分から。
デザインデータをもとに、レイアウトや余白、レスポンシブ時の見え方まで確認しながら、保守しやすい形で実装します。
不明点はそのままにせず、必要に応じて確認・ご提案を行いながら、丁寧に制作を進めます。

Estimate

制作内容やご予算に合わせて、必要な範囲をご提案します。
料金の目安はServiceページに掲載しています。
お見積りは無料ですので、お気軽にお問い合わせください。

View Service Contact

  1. 01 Coding

    コーディング

    デザインデータからの実装。レスポンシブ対応を含みます。

  2. 02 WordPress

    WordPress構築

    オリジナルテーマ制作と、更新しやすい管理画面の設計。

  3. 03 Landing Page

    ランディングページ

    1ページ完結の訴求設計と実装。読み進められる構成に。

  4. 04 Corporate Site

    コーポレートサイト

    複数ページの構造設計から実装まで。情報の並び順から整理します。

  5. 05 Interface

    UI実装

    動きや状態変化を含むUIの実装。意図した挙動をそのまま再現します。

  6. 06 Design

    デザイン

    Figmaでの設計・デザイン。実装を前提とした構造で組みます。

ABOUT

つくる人であり、整理する人でありたい。

Webサイトの実装を軸に、これまでのデザイン経験も活かしながら制作しています。
 見た目を再現するだけでなく、訪れる人が心地よく使えること、運用する人が迷わず更新できることも大切にしながら、実装しています。

Studio
brunest.studio ／ 個人事業として、Web制作を行っています。
Skills
HTML / CSS(Sass) / JavaScript / jQuery / PHP / WordPress
Focus
デザインと実装、両方の視点から考えること。
 意図を読み取り、情報を整理しながら、伝わる形へ落とし込むこと。
Role
コーディング・WordPress構築を中心に、WebデザインやUI実装・情報整理にも対応しています。
Tools
Figma / Photoshop / Illustrator / Cursor / Gulp
Adobe XDデータ対応
Next
実装を軸に、UI・情報設計・ディレクションへの理解を深める。
そして制作全体を見渡しながら、担える工程を広げることで、
提案や実装の質をさらに高めていきます。

brunest.studio

桂 昌子

CONTACT

まだ言葉に
なっていないことから、一緒に整理していきます。

制作会社さまからのご依頼、
個人での制作のご相談も承っています。

サイト全体の制作だけでなく、
1ページや一部分の制作からでも
ご相談いただけます。

まだ内容が固まっていなくても、
お気軽にご相談ください。

CONTACT

お問い合わせには、
通常2営業日以内に一度ご連絡いたします。