本文へ移動
CONTACT

Web制作・WordPress構築・運用サポート

WEB DESIGNCODINGWORDPRESS

つくるだけで、終わらせない。

デザインの意図を正しく読み取り、使いやすく、更新しやすく、
公開後も育てられるWebサイトを制作します。

制作実績を見るできることを確認する

制作会社さまの外部パートナー対応可
単発・継続、どちらもご相談いただけます。

WHAT I VALUE

きれいに作る。使いやすく整える。長く育てられる形にする。

Figmaなどのデザインデータをもとに、見た目の再現だけでなく、情報構造・操作性・更新性まで考えて実装します。

コーディング、WordPress構築、既存サイトの改修、公開後の保守まで。デザインと運用の間をつなぐ制作パートナーとして、茨城県を拠点に全国のオンライン案件に対応しています。

HTML / CSS / SCSSJavaScript/TypeScriptAstroWordPressBEM / FLOCSSAccessibilityMaintenance

STRENGTH

「納品できる」から、 「安心して任せられる」へ。

見た目、コード、公開後。どれか一つではなく、制作全体を見渡して進めます。

  1. 01

    デザイン意図を読み取る

    余白・文字組み・視線誘導まで確認し、画面幅が変わっても破綻しない形へ落とし込みます。

  2. 02

    保守しやすく組み立てる

    セマンティックなHTMLと再利用しやすいCSS設計で、修正や追加に強いコードを目指します。

  3. 03

    公開後まで視野に入れる

    更新方法、WordPress管理画面、表示確認、保守まで、運用担当者が困らない状態を整えます。

SERVICE

必要なところから、
柔軟に参加します。

デザインから公開までの一式はもちろん、コーディングのみ、WordPress化のみ、既存サイト改修にも対応します。

01

Web Design
& Development

構成整理、デザイン、レスポンシブ実装、フォーム、公開作業まで一貫して対応します。

  • 企業・店舗サイト
  • LP制作
  • サイトリニューアル
02

Coding

Figma・XD・Photoshop等のデザインをもとに、保守性と再現性を両立して実装します。

  • HTML / SCSS / JavaScript
  • アニメーション実装
  • アクセシビリティ配慮
03

WordPress

オリジナルテーマ、既存HTMLのWordPress化、SWELLカスタマイズ、投稿設計に対応します。

  • カスタム投稿・ACF
  • お問い合わせフォーム
  • 更新しやすい管理画面
04

Partner
Support

制作会社さまの外部パートナーとして、繁忙期や継続案件の制作・更新を支援します。

  • コーディング代行
  • 既存サイト改修
  • 保守・更新業務

WORKS

作ったものと、
積み重ねてきたこと。

公開可能な自主制作と、守秘義務のある実務案件の一部をご紹介します。

  1. 01

    Landing Page / Production Work

    Naeba Prince Hotel

    支給デザインをもとに、幅広い画面サイズへの対応とスライダー・アニメーション実装を担当した特設LPです。

    ROLE
    Front-end Development
    FOCUS
    Responsive × Motion
    • HTML
    • Sass
    • JavaScript
    • Swiper
    • GSAP
    VIEW PROJECT
  2. 02

    Corporate Site / Production Work

    司法書士事務所サイト

    既存テーマを活用しながら、支給デザインをWordPressに実装し、情報の整理・レスポンシブ調整・フォーム実装まで担当したコーポレートサイトです。

    ROLE
    WordPress Development
    FOCUS
    WordPress × Maintainability
    • WordPress
    • SWELL
    • CF7
    • CSS
    • Responsive
    VIEW PROJECT
  3. PRIVATE PROJECTCONFIDENTIAL
    03

    Client Work / Confidential

    非公開案件

    制作会社・事業会社のパートナーとして、既存サイトの改修・更新・保守やフロントエンド実装を担当しました。

    ROLE
    Front-end / Maintenance
    FOCUS
    Existing Code × Improvement
    • WordPress
    • JavaScript
    • TypeScript
    • Maintenance
    VIEW PROJECT
  4. 04

    Portfolio / This Website

    NobLAB. My Portfolio

    情報設計・アクセシビリティ・アニメーションを組み合わせ、実装そのものを体験として伝えるポートフォリオです（このサイトです）。

    ROLE
    Design / Front-end Development
    FOCUS
    Motion × Architecture
    • Astro
    • Sass(Dart Sass)
    • TypeScript
    • GSAP
    VIEW PROJECT
  5. 05

    Animal Clinic / Demo

    Lumiere Paw

    飼い主が迷わず情報へたどり着ける構成と、安心感のあるUIを意識して設計・実装した動物病院をイメージしたデモサイトを制作しました。

    ROLE
    Design / Front-end Development
    FOCUS
    Accessibility × UI
    • Design
    • HTML
    • Sass(Dart Sass)
    • JavaScript
    • GSAP
    VIEW PROJECT
  6. 06

    Cafe / Demo

    たろうのおうち

    青山にある老舗カフェをイメージし、チーム制作したWordPressサイト。投稿しやすい構造と、レスポンシブ対応を意識して設計・実装しました。

    ROLE
    WordPress Development
    FOCUS
    WordPress × Responsive
    • WordPress
    • Custom Post Type
    • Coding
    • Responsive
    • Maintenance
    VIEW PROJECT

PRICE

目的と範囲に合わせて、
無理のない形をご提案。

以下は標準的な実装を想定した目安です。ページ数・仕様・納期により個別にお見積もりします。

CODING

LPコーディング

¥60,000〜

  • デザインデータ支給
  • レスポンシブ対応
  • 基本的なアニメーション
RECOMMENDED

WEBSITE

小規模Webサイト

¥100,000〜

  • TOP＋下層3Pまでのコンパクトなサイト
  • デザインデータ支給
  • フォーム・基本SEO設定

WORDPRESS

WordPress組み込み

¥80,000〜

  • 既存サイトのWordPress化
  • 更新機能の設計
  • 管理画面からの編集対応

MAINTENANCE

保守・更新

¥5,000〜 /月

  • WordPress・プラグイン更新
  • 定期バックアップ・簡易動作確認
  • 修正・スポット対応 5,000円〜

※原稿作成、撮影、複雑な機能・アニメーション、短納期対応は別途お見積もりとなります。

QUICK ESTIMATEかんたん見積もりを試す 必要な項目を選択すると、制作費用の目安を確認できます。

FLOW

ご相談から公開まで。

内容が固まっていない段階でも大丈夫です。必要な情報と優先順位を一緒に整理します。

  1. 01

    お問い合わせ

    サイトの目的、希望時期、予算感など、分かる範囲でお知らせください。

  2. 02

    ヒアリング

    必要なページ、機能、素材、担当範囲を確認し、進め方を整理します。

  3. 03

    制作・確認

    進捗を共有しながら制作。表示・操作・レスポンシブを確認します。

  4. 04

    公開・運用

    公開作業と最終確認を行い、必要に応じて保守・更新も継続します。

Contact

一緒に、
使い続けられるサイトを。

コーディングのみ、WordPress化、既存サイトの改修、継続的な制作支援など、まずはご相談ください。

制作会社さま・事業会社さま

単発案件も、継続パートナーも
ご相談いただけます。Let's talk！平日 9:00–17:00を中心に対応しています。