ordinary.

Freelance web designer — JapanWeb / LP / Identity — 2026

ふつうの毎日を、
ちゃんと選ばれる形に

個人事業・小さなお店のためのWebサイト、LP、ロゴ制作。伝えたいことの整理から、デザイン、コーディング(Webページとして組み立てる作業)、公開まで対応します。

作業机に広げたデザインの紙とノートパソコン

01 — Selected works

つくったもの。
これからつくるもの

ここに並ぶのは、すべて架空のお店・商品を想定して制作した見本の作品です(実在の企業・お客様の案件ではありません)。

Selected — 04Start here
Index — 25All works
01動物病院のサイト(架空)「いま、どうすれば?」に症状を選んで答える判断フロー。選んだ症状で今すぐ電話・今日の受付・様子見のどれかに切り替わり、受付状況も自動表示。Animal hospitalWebサイト 02あかり不動産駅を中心に歩5・10・15分の円を描いた地図が主役。条件で絞るとピンと物件の一覧が連動し、初期費用の内訳は積み上げバーで見せる。Real estateWebサイト 03結びの間結婚相談所のサイト。料金をすべて先に見せ、活動の期間から総額の目安を出す計算と、解約のルールまで載せた構成。Marriage agencyWebサイト 04hair atelier mio小さな美容室のサイト。髪色の見本を選ぶと、写真の髪色がその色に変わるカラーシミュレーター。Hair salonWebサイト 05みなと精工 採用サイトスクロールでノギスが閉じて「0.01mm」まで進み、設計図の質感で見せる採用サイト。3つの質問で、針が振れて合う職種に収束する診断つき。RecruitingWebサイト 06人材紹介サービス(架空)「いま、どこにいますか?」の1問に答えると、道しるべの札が向きを変えて次の一歩を示す。相談から入社までの5ステップは、スクロールで横に流れる。StaffingWebサイト 07貸別荘の公式サイト(架空)高原の夜の一軒家を描いた多層のイラスト。スクロールで窓の灯りがひとつずつともり、空室は月の満ち欠けで選べる。Vacation rentalWebサイト 08Yoyaku Note電話やLINEの予約が通知で届き、カレンダーの枠に自動で入る様子を実際に動かして見せるLP。削減できる時間の計算つき。SaaSLP 09ことり工務店木の家をつくる工務店のサイト。家の線画が「骨組み→屋根→窓」の順に描かれ、完成した家の写真に変わる。Custom homesWebサイト 10みどり税理士事務所方眼を背景にした大きな見出しと、描かれていく棒グラフ。売上の目盛りを動かすと、月々の顧問料の目安が変わる定規。Tax officeWebサイト 11ひかり個別指導塾方眼ノートに見出しが手書きで書かれ、「わからない」に赤丸が付く。部活の曜日を選ぶと、重ならない通塾日が付箋にペンで書き込まれる。Tutoring schoolWebサイト 12ツムギ メディカル医療機関と医療従事者の2つの扉と、両者を結ぶ一本の糸。条件タグで絞る求人一覧と、入口で切り替わる登録フォーム。Medical staffingWebサイト 13はるの歯科クリニック現在時刻を巨大に見せ、「診療中/次は何時から」を自動で表示。診療時間は横に伸びるタイムラインで、歯の線画がスクロールで描かれる。Dental clinicWebサイト 14ゆとり住設スクロールでタンクの水温が8℃から57℃へ上がり、背景も冷たい青からあたたかい橙へ。容量シミュレーターと明細つきの料金表。Home equipmentLP 15ことのは「こ・と・ば」が積み木のように組み上がるファーストビュー。千葉市の区を選ぶと教室が出る地図つき。Child supportWebサイト 16ひなた横浜の鍼灸・リラクゼーションサロンのサイトと三つ折りフライヤー。手をかざすと、お灸のように温かい光が残る。SalonWebサイト+フライヤー 17SOLE白とグレーのパティスリー&カフェ。ぼかした写真を、カーソルのレンズでのぞくとケーキがくっきり見える。PatisserieWebサイト 18MINORI和歌山の果物カフェのサイト。月を選ぶと旬の果物とメニューに切り替わり、サイトの色まで果物の色に変わる。CafeWebサイト 19HADAE薬用スキンケアの商品LP。写真に触れると水面のように波紋が広がる。医薬部外品として言える表現の範囲で設計。SkincareLP 20オンライン英会話のLP(架空)スクロールで空が夕暮れから夜へ移り、窓の灯りが増える。ヒーローのチャットで英会話が実際にタイピングされ、フォーム入力のたびに街の窓が灯る。Online EnglishLP 21Neuro Careセラピスト養成スクールのLP。画面全体が「吸って4秒・吐いて6秒」で呼吸する、ファーストビュー。SchoolLP 22Komorebi季節と食のためのレストランサイト。静かな食事の時間を、予約前から感じられるように。RestaurantWebサイト 23Lumen Notes毎日の光を届ける小さなプロダクト。使った後の気分を伝えるためのLP。ProductLP 24NUIMEアパレルOEM(他ブランドの服を受託製造する会社)の会社紹介サイト。取引先に「任せて大丈夫」と思ってもらうための、静かで精密な見せ方。Apparel OEMWebサイト
25madori暮らしの小さな道具店のブランド設計。手渡るたびに店の思想が伝わるアイデンティティ。Shop名刺

02 — Case notes

なぜ、そう
つくったか

見本の中から3つ、どう考えてつくったかを書きました。いずれも架空のお店・会社を想定した見本です。

Real estate

あかり不動産

誰のための見本か
はじめてお部屋を探す人に向けた、街の賃貸不動産会社のサイト(架空)。
設計の判断
探す前に気になるのは「駅から何分か」と「入居にいくら要るか」。この2つを、探す画面の中で先に分かるようにしました。
やったこと
賃料・間取り・駅からの時間で絞ると、歩5分・10分・15分の円の図と物件一覧が一緒に変わる仕組み。賃料を選ぶか入れると、敷金・礼金・仲介手数料などの内訳と合計の目安が出る計算。物件ごとの詳細に、取引態様や情報の更新日などの表示項目をそろえました。
見本を見る ↗
Marriage agency

結びの間

誰のための見本か
結婚相談所を検討中で、勧誘や費用に不安がある人に向けたサイト(架空)。
設計の判断
不安の中心は「結局いくらかかるか」と「やめられるか」。だから料金を先にすべて見せ、解約のルールまで載せる構成にしました。
やったこと
入会金・月会費などの料金表と、活動の期間を動かすと総額の目安が出る計算。クーリング・オフ(契約後に無条件で解除できる制度)・成婚料・中途解約の説明。5段階の活動の流れ、予約フォーム(見本のため送信はされません)。
見本を見る ↗
Recruiting

みなと精工 採用サイト

誰のための見本か
製造業に興味はあるが、自分に合う仕事が分からない未経験の人に向けた採用サイト(架空)。
設計の判断
応募前の迷いは「自分に何が向いているか」。3つの質問に答えると、合いそうな職種の目安が出る入口を作りました。
やったこと
職種診断、数字4項目(数値は見本用の架空で、集計の期間と対象を併記する前提の注記つき)、1日の流れ、職種ごとに切り替わる募集要項。労働条件の記載項目をそろえる前提で作っています。
見本を見る ↗

03 — Service & price

必要なものを、
必要なかたちで

料金は税込の目安です。内容・ページ数・素材の有無を伺ってからお見積りします。ドメイン・サーバー代や有料の写真素材代は別途かかります。

01

LP制作Landing page

LPは、1ページで商品やサービスを紹介し、申し込みや購入につなげるページです。構成・デザイン・コーディング・スマホ対応まで。

¥40,000〜
02

Webサイト制作Website

5ページ程度とお問い合わせフォーム。お店や事業の「はじめまして」を任せられるサイトに。

¥80,000〜
03

ロゴ・名刺Identity

ロゴ、名刺、ショップカード。Webと紙で同じ印象になるように揃えます。

¥20,000〜
04

バナー・修正Banner / Fix

広告バナー、既存サイトの文言差し替えや小さなデザイン修正。

¥5,000〜

04 — How I work

話す。見つける。
整える。届ける

スケジュールはご相談時に一緒に決めます。各段階で確認をいただいてから次に進みます。

01

話す

目的、届けたい相手、予算と納期を伺い、ゴールを一文にまとめます。

Hearing
02

見つける

伝える順番を組み立て、原稿を整理。ページの骨組み(ワイヤーフレーム)で構成を確認します。

Structure
03

整える

デザインを作成し、確認後にコーディング。PCとスマホの両方で表示を確かめます。

Design / Build
04

届ける

公開作業まで対応します。公開後の修正もご相談ください。

Launch

Before you askご相談の前に

01 用意するもの

目的(何のためのページか)、届けたい相手、ご希望の納期とご予算。これだけで始められます。原稿・写真・ロゴ・参考にしたいサイトがあれば、あるものだけお知らせください。

02 納期の目安

ページ数と素材の有無で変わるため、一律の日数はお約束していません。ご希望の公開日を先に伺い、間に合うかどうかをお見積りと一緒に日付でお返事します。

03 見積りの出し方

目的・ページ数・素材の有無を伺ってから、内訳を書いた見積りを文章で出します。ご納得いただけてから制作に入り、途中での追加は先にご相談します。

05 — About

ふつうの言葉を、
特別な出会いの入口に

ordinary のシンボルマーク

ordinaryは、Web制作とグラフィックデザインで、小さな事業や個人の魅力を見つけ、届く形に整えるフリーランスです。

チラシ、広告バナー、LP、ロゴの制作を経験してきました。見た目だけで終わらせず、「誰に・何を・どの順番で伝えるか」から一緒に考えます。

平日は会社員として働きながら、夜と週末に制作しています。お返事は24時間以内を目安にしています。

対応範囲
構成・原稿整理・デザイン・コーディング・公開
ツール
Illustrator / Photoshop / InDesign / Premiere Pro
稼働
平日夜・土日(やり取りはメッセージ中心)
信頼性
クラウドワークス 本人確認済みクラウドワークスの秘密保持契約(NDA)締結済み

Working with AIAIと進める制作

01 使うAIと用途

構成案・デザイン・コーディング(Webページとして組み立てる作業)には、Anthropic社のAI「Claude」を使います。見本に使う写真は、OpenAI社の画像生成AIで作ったイメージです。

02 人が確認すること

ご要望の整理、仕上がりの確認、依頼者とのやり取りは、私が行います。AIが作ったものを、そのままお渡しすることはありません。

03 AIにまかせないこと

商品写真を実物と違って見えるように加工することはしません。法律(薬機法・景品表示法など)にかかわる表現は、AIの判断にせず、依頼者と確認して決めます。

06 — FAQ

よくある質問

原稿や写真がなくても頼めますか?

はい。伺ったお話から原稿のたたき台を作り、一緒に整えます。写真は素材サイトの利用や、撮影時のポイントのご案内もできます。

修正は何回までできますか?

デザイン確定までに、方向性の大きな修正を2回まで料金内で対応します。文字や色の小さな調整は回数に含めません。

公開後に自分で更新できますか?

更新の頻度やご予算に合わせて、作り方をご相談のうえ決めます。

支払いはどうなりますか?

クラウドワークス経由でのご依頼をおすすめしています。契約時に代金をクラウドワークスへ預ける「仮払い」の仕組みがあり、納品物を確認してから支払いが確定するので安心です。

07 — Start a project

Let's talk

ご相談はこちらから

まだ言葉になっていない魅力から、はじめましょう。「こんなものを作りたい」を一行送っていただくだけで大丈夫です。