WEB IMPLEMENTATION & WORDPRESS

デザインの意図を、
動くかたちへ。

提供デザインから、実装・WordPress構築へ。
公開後の保守まで見据え、
使いやすさと更新のしやすさを考えます。

01 / SELECTED PROJECTS

Selected work

担当したこと。
工夫したこと。

コンクリート建築の写真を背景に「WP + Next.js」と表示したテストサイトのトップページHEADLESS CMS / TEST SITE

03 / HEADLESS CMS TEST

WP + Next.js

WordPressをCMS、Next.jsを表示側にしたヘッドレスCMSのテストサイト。カスタム投稿・カスタムフィールドの表示を検証しています。問い合わせフォームはNext.jsのServer ActionsとResendを使用。入力チェック・確認画面・管理者通知・自動返信メールに対応しています。

種別
技術検証用のテストサイト
担当
WordPress・Next.jsの連携と実装
  • WordPress
  • Next.js
  • Headless CMS
WP + Next.jsのテストサイトを見る
02 / THE DETAILS

Made to adapt.

小さな変化にも、
理由のある実装を。

画面が狭くなっても、文章が長くなっても。
同じHTMLが、内容に合わせて姿を変えます。

実案件ではない、オリジナルの技術デモ
mono /A STUDY IN RESPONSIVE DESIGN

FORM FOLLOWS INTENT.

Quiet form.
Clear purpose.

かたちに意図を。日々の暮らしに、静かな余白を。

コレクションを見る

THE COLLECTION / かたちを見つめる

01 — Balance
02 — Rhythm
03 — Structure

この画面は、レイアウト・文量・操作性を確かめるための架空のサイトです。

画面幅：広い ／ 文章量：標準

  • 画面幅に応じて、同じ内容を再配置。
  • 文章の量に合わせて、高さが自然に変化。
  • キーボードでも、移動・開閉が可能。
03 / THE APPROACH

Beyond the build.

実装する。確かめる。
支え続ける。

  1. 01 / ALIGN

    意図を揃える。

    仕様と担当範囲を確認し、デザインの意図を実装につなげます。

  2. 02 / BUILD

    使えるかたちに。

    HTML・CSS・JavaScriptによる実装と、WordPressのサイト構築に対応します。

  3. 03 / VERIFY

    仕上がりを確かめる。

    自作の「figma-design-overlay」でデザインと実装画面を重ね合わせ、透かしチェックで位置や余白のずれを目視でも確認します。表示速度・HTMLの妥当性・操作性は別途検証し、案件要件に応じてアクセシビリティにも対応します。

  4. 04 / CARE

    その先を支える。

    公開作業から保守、顧客対応まで。更新する人、使う人のことを考えます。

AUGMENTED BY AI.
GUIDED BY EXPERIENCE.

AIを使い、判断と検証を重ねる。

複数案件を進めるため、OrcaでCodex・ClaudeなどのAIエージェントを活用。変更範囲と検証項目を明確にし、保守しやすい構造と実装後の表示・操作確認を重視しています。

04 / THE PERSON BEHIND THE WORK

つくる人にも、
使う人にも。

新井 一充

WEB IMPLEMENTATION / WORDPRESS

Webサイト制作を中心に、実装、WordPress構築、公開、保守、顧客対応に携わってきました。提供されたデザインを形にし、運用までを考えて制作に取り組んでいます。

所属・経歴
2019年7月からWeb制作会社に勤務し、Webサイトの制作・構築・運用に従事しています。
働き方
リモートワークを希望。
群馬県伊勢崎市から通える範囲での出社も相談可能。
  • HTML / CSS / JavaScript
  • WordPress
  • Git
  • Figmaからの実装
  • Vite
  • Tailwind CSS
  • Next.js（個人制作）
経歴の印刷用ページを見る