LEOLINE / WORKS · WEB SITE / 2026
人と支援を、
知りたい人に届ける。
発見があるWeb体験へ。
株式会社ぽっけりんく様の公式ホームページを全面リニューアル。理念・支援・スタッフ・4施設・利用案内・保護者向け情報・採用まで、役割ごとにページを設計。写真撮影・Hero動画・動く背景・WordPress開発・360°VR連携まで一貫して制作しました。
01 / PROJECT STORY
まず、ぽっけりんくの
「大切にしていること」を知る。
ぽっけりんく様は、札幌市で児童発達支援・放課後等デイサービスを運営しています。目指しているのは、子どもたちが自分の可能性を信じ、いつか「自分で自分にはなまるをつけられる」こと。
制作にあたっては代表への取材を重ね、会社の理念、スタッフの経験・資格、日々の支援、施設ごとの特徴を整理しました。以前は会社案内と施設情報が分かれた構成だったため、新しい公式サイトでは4施設を一つの情報体系に統合しています。
もっと知ってもらえるサイトへ。
代表インタビューで語られた思いを、写真・紹介文・情報構成に反映。
人が見えること
資格や経歴だけでなく、支援に向き合う姿勢やチームの関係性まで伝える。
場所の違いが分かること
4施設それぞれの役割・特色・空間・過ごし方を独立したページで紹介する。
安心して探せること
初めて調べる保護者にも分かりやすく、楽しく閲覧できるWeb体験を設計する。
02 / INFORMATION ARCHITECTURE
ページを増やすことではなく、
見る人の目的に合わせて設計する。
旧ホームページでは、会社そのものの情報と事業所の紹介が分かれていました。まず取材を通じて「会社は何を大切にしているか」「スタッフはどんな専門性を持つか」「4施設は何が違うか」を整理。その上で、保護者・利用を検討するご家庭・働くことを考える方が、それぞれ必要な情報へ進めるサイト構造を考えました。
何から調べたらいいか分からない方へ
サービスや支援の仕組みを基礎から理解できるように、利用案内・FAQ・相談への導線を整理。
利用案内 → よくある質問 → 見学・相談子どもに合う場所を探すご家庭へ
支援の違い、人、施設環境を見比べた上で判断できるよう、4施設・スタッフ・VR・選び方ガイドをつなぐ。
支援・スタッフ → 4施設 → VR・見学ぽっけりんくで働くことを考える方へ
募集条件だけでなく、学び合う文化や現場の人柄を伝え、興味を持った段階から相談できる構成に。
理念・チーム → 採用情報 → エントリーTOPページは情報をすべて詰め込む場所ではなく、必要なページを見つける入口。セクションごとの「PAGE GUIDE」や自然な関連リンクも含め、迷いにくい回遊構造を設計しました。
03 / PHOTOGRAPHY
伝えたいのは、
施設だけではなく「人」。
スタッフの集合写真やプロフィール写真、施設の空間、実際の活動を伝える撮影素材をWeb全体に活用しました。写真は飾りではなく、訪れる保護者が「どんな人たちが子どもに関わるのか」を知るための大切な情報です。
スタッフ紹介では、保育・心理・教育など異なる専門性を持つメンバーの経歴や資格、考え方を丁寧に掲載。チームで支えるぽっけりんく様の強みが見える構成を目指しました。
04 / HERO MOVIE
最初の数秒で、
温かさを感じてもらう。
TOPページのHero動画もLeolineが撮影。広告的な演出を強くするのではなく、ぽっけりんく様の日常をそっと覗いているような、自然な映像表現を目指しました。
PC・タブレット・スマートフォンに合わせて複数解像度のMP4とWebPポスター画像を用意し、画質と読み込み負荷のバランスにも配慮しています。
05 / PLAYFUL INTERACTIVE DESIGN
ただ読むだけではない。
訪れるたびに発見があるサイト。
「このページのひみつ」は、TOPページに用意した小さな遊び心。札幌の日の出・日の入りに合わせて変わる空と太陽、月齢に応じた月の満ち欠け、ときどき現れる動物や流れ星。日によって、時間によって、出会える景色が変わります。
空の色
朝・昼・夕方・夜で、少しずつ変わる空模様。
太陽
札幌の日の出・日の入りに合わせた動き。
月
夜空に現れる月は、月齢によって形が変化。
動物たち
鹿・キツネ・リス・フクロウなどが時折登場。
流れ星
出会えたらラッキーな、夜だけの特別な演出。
ページ背景のアニメーションもセクションごとに独自設計。芽の成長、声やつながりを思わせる曲線、利用までの道筋を示す動きなど、コンテンツの意味と結びついた表現にしています。動きは写真や文章より一歩控えめに。スクロールや画面表示に合わせて無駄な処理を抑え、スマートフォンや動きの軽減設定にも配慮しました。
芽や葉が動く共通演出で、サイト全体の世界観をつなぐ。
スタッフの会話・チーム・支援の広がりを、曲線や光の動きで表す。
利用までの流れや施設選びを、進む線・ステップなどで見せる。
06 / FOUR FACILITIES
4つの施設に、4つの個性。
4施設それぞれに専用の紹介ページを制作。共通のレイアウトルールを保ちながら、施設の写真、色、特徴、支援の考え方、一日の過ごし方などを丁寧に整理しています。同じ紹介文を並べるのではなく、その施設らしさが伝わることを大切にしました。
みんなと一緒に、楽しさを知る場所。
子どもたちがつくる、学びの場所。
笑顔が集まる、憩いの場所。
くらしの力を育てる、学びの場所。
07 / PAGE DESIGN & ROLE
ページには、一つひとつ
伝えるべき役割がある。
会社案内、支援、スタッフ、施設、利用、情報発信、採用。作成したページは数多くありますが、単にメニューを増やしたのではありません。「この情報を誰が、どんなときに必要とするのか」を整理し、関連するページ同士をつないでいます。以下は制作した主なページ群と、それぞれの役割です。
理念・支援・人を伝える
COMPANY / SUPPORT / TEAM
私たちについて
会社名の由来、理念、代表の思い、スタッフを大切にする考え方を整理。企業としての姿勢を伝える基点です。
実際のページを見る ↗支援について
学習・ソーシャルスキルトレーニング（SST）・生活・将来支援に加え、個別支援計画、家庭支援、関係機関との連携を紹介。
実際のページを見る ↗スタッフ紹介
実際の写真、経歴、資格、メッセージを掲載。一人の強みだけでなく、専門性を持ち寄って支えるチームの姿も見せます。
実際のページを見る ↗保護者の声
保護者アンケートとGoogleマップの口コミを出典別に紹介。施設側の説明だけでは伝えきれない日常の姿を届けます。
実際のページを見る ↗4施設を見比べ、空間を確かめる
FACILITIES / VIRTUAL TOUR
施設紹介一覧
4施設の対象、特徴、雰囲気を比較する入口。ひとつのブランドとして統一しながら、施設ごとの個性を残しました。
実際のページを見る ↗4施設の個別ページ
各施設に「特徴・支援・一日の流れ・施設空間とVR・スタッフ・アクセス・見学相談」を用意し、現地を訪れる前の理解を深めます。
実際のページを見る ↗360°VRで施設見学
写真ではつかみにくい空間の広さや部屋同士のつながりを、スマホやPCから確認。実際の見学へ進む前の判断材料に。
実際のページを見る ↗自己評価・情報公開
4施設の事業所自己評価や保護者等の評価結果を、施設・サービス種別に整理してPDFで公開。透明性を支えるページです。
実際のページを見る ↗保護者の迷いに応え、継続してつながる
GUIDE / ARTICLE / CONTACT
利用案内
利用対象、手続き、料金、送迎、FAQ、見学までの流れを整理。初めての保護者が一つずつ確認できます。
実際のページを見る ↗放デイ選びガイド
施設の環境、スタッフの関わり、支援、費用、過ごし方など比較ポイントを紹介。自社施設だけを勧めず、ご家庭に合う選択を助けます。
実際のページを見る ↗子育て・発達コラム
発達・学習・コミュニケーション・不登校・子育てなどをテーマ別に整理。利用前のご家庭にも役立つ記事を積み重ねられます。
実際のページを見る ↗お知らせ
施設の活動やイベント、ご利用案内、採用情報などを分類して掲載。サイト公開後も、日々の情報を更新できる仕組みです。
実際のページを見る ↗お問い合わせ
見学・利用相談に加え、採用やメディア関連の問い合わせを受け付ける導線を整備。まだ利用を決めていない段階にも配慮しています。
実際のページを見る ↗働く人を知り、次の一歩へ
RECRUIT / ENTRY
採用情報
働く目的、支援する人の姿、チームの成長、職場環境、募集内容を構成。待遇だけでは分からない仕事の魅力を伝えます。
実際のページを見る ↗採用エントリー
正式応募だけでなく「まず話を聞きたい」「働き方を相談したい」段階にも対応。経歴だけでなく、本人の思いを伝えられるフォームです。
実際のページを見る ↗はなまる北・北ポロ・北ミナ・北ラムの4施設では、ブランドカラー、掲載写真、支援の特色、空間の紹介をそれぞれ最適化。一方で、情報の並び方やナビゲーションは共通化し、ページを行き来しても比較しやすい設計にしました。
08 / DESIGN, DEVELOPMENT & OPERATION
その日だけ美しいサイトではなく、
公開後も育てられる仕組みへ。
企画・撮影・デザインに加え、WordPress・Astra・Elementorを基盤とし、独自HTML・CSS・JavaScript・PHPで必要な機能や見せ方を実装。表示速度、画像・動画の軽量化、スマートフォンの使いやすさ、SEOの基本設定、GA4・Search Consoleとの連携など、公開後の更新・検証も見据えています。
お知らせ・コラム・スタッフ・施設の情報を役割別に整理し、継続運用を考慮。
PC・タブレット・スマートフォンで写真・文字・動きを調整し、横はみ出し等も改善。
検索を意識したページ構造、見出し、記事カテゴリ、SEOの基礎設定を整備。
GA4・Search Console連携、スタッフプロフィールへの関心を把握する仕組みなどを導入。
※アクセス増加・検索順位・お問い合わせ数などの成果は、十分な計測期間がないため本記事では数値として断定していません。解析機能の設置と成果の発生は区別しています。
09 / THE RESULT OF OUR WORK
写真、映像、Web、VRを通して、
ぽっけりんくらしさを形に。
私たちが目指したのは、技術を見せることだけではありません。ぽっけりんく様が大切にしている理念と人を知り、保護者・子ども・採用希望者それぞれの目線で、必要な情報が伝わる場所を作ること。
企画・撮影・Webデザイン・独自開発・VR連携を一貫して考え、見る人が思わず楽しみながら、スタッフの魅力、施設の個性、支援内容、利用までの流れを確かめられるWeb体験にまとめました。
CLIENT : 株式会社ぽっけりんく / LOCATION : 北海道札幌市 / WEB SITE LAUNCH : 2026.10.26 / PRODUCTION : 株式会社Leoline
※本記事は制作内容の紹介です。検索順位・問い合わせ件数・採用件数等の改善実績を保証するものではありません。