[{"data":1,"prerenderedAt":489},["ShallowReactive",2],{"detailkidzania":3,"detail_relatedkidzaniaparenting":32,"$fGXDWELF8-pFwL5SWtP-mUJPwAC8MVHMPCn54oooS2jA":65,"$fS4sOnCUpoF-wMfw16HWwnBnngwddN9OaX5p2KHuFyVA":98,"works":323},{"id":4,"createdAt":5,"updatedAt":6,"publishedAt":6,"revisedAt":6,"title":7,"content2":8,"eyecatch":9,"tag":13,"heading_list":20,"recruit":26,"is_html":26,"is_migration":26},"kidzania","2026-04-22T08:07:32.449Z","2026-04-28T08:04:58.239Z","キッザニアの仕組みと回り方のポイント","\u003Cp>いろんなことを忘れていきます。\u003Cbr>\u003Cbr>この記事は、社内イベント「\u003Ca href=\"https://www.s2factory.co.jp/blog/tea/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">\u003Cu>お茶会\u003C/u>\u003C/a>」での発表内容をもとにまとめたものです。\u003Cbr>今回は弊社の tkoba が、「\u003Cstrong>キッザニア」\u003C/strong>について話しました。\u003C/p>\u003Chr>\u003Cp>\u003Cbr>子どもを連れて\u003Ca href=\"https://www.kidzania.jp/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>キッザニア\u003C/strong>\u003C/a>によく行きます。\u003Cbr>今回はその経験をもとに、\u003Cstrong>仕組みや回り方のポイント\u003C/strong>をまとめてみました。\u003C/p>\u003Ch2 id=\"h48e44c0c2b\">キッザニアとは\u003C/h2>\u003Cp>キッザニアは、\u003Cstrong>「子どもが主役」のお仕事体験型テーマパーク\u003C/strong>です。\u003Cbr>対象は 3 歳から中学生まで。施設内では、子どもがさまざまな職業を体験できます。\u003C/p>\u003Cp>特徴的なのは、大人の立ち位置で、保護者は施設内に入ることはできるものの、基本的に体験には関与できません。あくまで主役は子どもです。\u003C/p>\u003Cp>\u003Cstrong>館内には企業が出展するパビリオン(店舗)が並び、それぞれが“仕事”としてのアクティビティを提供\u003C/strong>しています。子どもはそこで働くことで報酬を得たり、逆にお金を支払ってサービスを受ける側になることもあります。\u003C/p>\u003Cp>施設内で使われる\u003Cstrong>通貨は「キッゾ(Z)」\u003C/strong>。\u003Cbr>初回には50キッゾが支給されますが、それ以降は自分で働いて稼ぐ必要があります。\u003C/p>\u003Ch3 id=\"h7a529d8b03\">キッザニアの基本情報\u003C/h3>\u003Cp>\u003Cstrong>キッザニアは1999年にメキシコで誕生\u003C/strong>し、\u003Cstrong>現在は世界19カ国・29拠点に展開\u003C/strong>されています。\u003Cbr>\u003Cstrong>海外初進出は日本\u003C/strong>で、2006年に東京・豊洲にオープンしました。運営は KDDI グループに属する\u003Ca href=\"https://www.kidzania.jp/corporate/\" target=\"_blank\" rel=\"noopener noreferrer\">KCJ GROUP株式会社\u003C/a>。\u003C/p>\u003Cp>日本国内では以下の 3 拠点があります。\u003C/p>\u003Cul>\u003Cli>\u003Ca href=\"https://www.kidzania.jp/tokyo/\" target=\"_blank\" rel=\"noopener noreferrer\">東京(ららぽーと豊洲)\u003C/a>\u003C/li>\u003Cli>\u003Ca href=\"https://www.kidzania.jp/koshien/\" target=\"_blank\" rel=\"noopener noreferrer\">甲子園(ららぽーと甲子園)\u003C/a>\u003C/li>\u003Cli>\u003Ca href=\"https://www.kidzania.jp/fukuoka/top\" target=\"_blank\" rel=\"noopener noreferrer\">福岡(ららぽーと福岡)\u003C/a>\u003C/li>\u003C/ul>\u003Cp>施設ごとに体験できるパビリオンの内容には多少の違いがあります。\u003C/p>\u003Ch3 id=\"h139246c58e\">キッザニア東京\u003C/h3>\u003Cp>キッザニア東京は、ららぽーと豊洲の一角にあります。\u003Cbr>\u003Cstrong>現在は事前予約が必須\u003C/strong>で、当日ふらっと入ることはできません。\u003C/p>\u003Cp>\u003Cstrong>入場は 2 部制\u003C/strong>になっており、以下のように時間が分かれています。\u003C/p>\u003Cul>\u003Cli>第1部：9:00〜15:00\u003C/li>\u003Cli>第2部：16:00〜21:00\u003C/li>\u003C/ul>\u003Cp>このほかにも、短時間のチケットや優先入場など複数の種類があり、チケット体系はやや複雑です。\u003C/p>\u003Cp>料金の一例(休日・第1部)は以下の通りです。\u003C/p>\u003Cul>\u003Cli>小人（3〜12歳）：5,500円\u003C/li>\u003Cli>中人（13〜15歳）：5,500円\u003C/li>\u003Cli>大人（16歳以上）：2,700円\u003C/li>\u003C/ul>\u003Cp>入場は ABC のブロックに分かれており、それぞれおよそ40組ずつで案内されます。\u003Cbr>とにかく混んでいて、平日の月曜日でも、\u003Cstrong>入場の 3 時間前に受付して約120番目\u003C/strong>でした。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/259d4d156e6e41b68fe1f5d96cb8a053/%E9%A0%86%E7%95%AA%E5%BE%85%E3%81%A1.png?w=600&amp;h=483\" alt=\"順番待ち\" width=\"600\" height=\"483\">\u003C/figure>\u003Cp>\u003Cbr>平日でもこの状況なので、休日はさらに混雑します。入場前からすでに競争が始まっていると考えた方がいいです。\u003C/p>\u003Cp>ちなみに、館内ではピザや日本ハムなどのパビリオンで商品を購入することもでき、この場合はキッゾではなく現金が利用できます。\u003Cbr>詳しくは\u003Ca href=\"https://www.kidzania.jp/pdf/city_map/map_tokyo.pdf\" target=\"_blank\" rel=\"noopener noreferrer\">こちら\u003C/a>をご覧ください。\u003C/p>\u003Cp>\u003C/p>\u003Ch3 id=\"h7256896ff5\">キッザニアを楽しむための心構え\u003C/h3>\u003Cp>キッザニアではすべてが\u003Cstrong>早い者勝ち\u003C/strong>です。\u003Cbr>人気のアクティビティはすぐ埋まるため、何をどう回るかで体験できる内容が大きく変わります。\u003C/p>\u003Cp>\u003Cstrong>館内の手続き(予約や受付など)はすべて子どもが行うのが前提\u003C/strong>で、大人は基本的に手を出せません。\u003Cbr>その分、\u003Cstrong>次に何をやるかを判断する“親の動き”も重要\u003C/strong>になってきます。\u003C/p>\u003Cp>1 つのアクティビティは 5 〜 6 人と枠が少なく、複数のアクティビティが同じ時間帯にまとまって始まり、さらに15分ほどずれて別の回が始まる構造になっています。\u003Cbr>また、1つのアクティビティにかかる時間は30 〜 40分程度が多く、長いものだと90分ほどかかる場合もあります(裁判所など)。\u003Cbr>そのため、\u003Cstrong>1 日を通して体験できるのは 5 〜 6 個ほどが目安\u003C/strong>で、すべてを回ることはできません。\u003Cbr>\u003Cbr>迷っていると、先着順でどんどん埋まっていきます。\u003C/p>\u003Cp>待機場所も限られており、待ち時間が発生するとその間は何もできません。\u003Cbr>なので\u003Cstrong>事前にある程度の計画を立てておくのが前提\u003C/strong>です。\u003C/p>\u003Ch2 id=\"h99beb4c042\">大まかな 1 日の流れ\u003C/h2>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f43ebb81f6d24d9f874e1d55df01c30b/%E9%A4%A8%E5%86%85%E3%81%AE%E6%A7%98%E5%AD%90.png\" alt=\"館内の様子\" width=\"1718\" height=\"1150\">\u003Cfigcaption>館内の様子。\u003C/figcaption>\u003C/figure>\u003Cp>\u003Cbr>ここからは、キッザニア東京の第 2 部をもとに、当日の流れを見ていきます。\u003C/p>\u003Ch3 id=\"h1fd24d0ec6\">入場前\u003C/h3>\u003Cp>ららぽーと到着後、まず受付を済ませると、入場のための待機場所が指定されます。\u003Cbr>少しでも早く入りたい場合は、\u003Cstrong>3 〜 4 時間前には受付を済ませておく\u003C/strong>必要があります。\u003C/p>\u003Cp>実際、平日の第 1 部に行った際は朝 6 時に到着しましたが、それでもすでに多くの人が並んでおり、かなり待つことになりました。\u003C/p>\u003Cp>受付後、子どもには\u003Cstrong>「Jobスケジュールカード」\u003C/strong>が 1 人 1 枚渡されます。\u003Cbr>\u003Cstrong>アクティビティの受付や予約は、すべてこのカードを使って行う\u003C/strong>ためとても重要なアイテムです。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/2d6b84279e82459490ca48f5671282c2/%E3%82%B8%E3%83%A7%E3%83%96%E3%82%AB%E3%83%BC%E3%83%89.png?w=450&amp;h=474\" alt=\"ジョブスケジュールカード\" width=\"450\" height=\"474\">\u003C/figure>\u003Cp>\u003Cbr>どんな仕事があるか自体は事前にある程度把握できますが、\u003Cstrong>「どのアクティビティが何時から始まるか」は入場後でないとわかりません\u003C/strong>(最近は並んだ際に発行されるレシートに一部情報が記載されるようになり、多少はわかりやすくなりました)。\u003C/p>\u003Ch3 id=\"h445685a55e\">アクティビティの予約\u003C/h3>\u003Cp>キッザニアの予約システムは少しわかりづらく、最初につまずきやすいポイントです。\u003C/p>\u003Cp>まず、予約は各パビリオンの受付でしか行えません。\u003Cbr>また、\u003Cstrong>予約できるのは 1 つまで\u003C/strong>で、すでに予約がある状態では、その開始時間までに終わるアクティビティしか参加できません。\u003C/p>\u003Cp>\u003Cstrong>予約は集合時間単位でしか取ることができず、後の回を自由に選ぶことはできません\u003C/strong>。\u003Cbr>受付のスタッフに声をかけ、JobスケジュールカードのQRコードを読み取ってもらうことで予約が確定します。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/7ad66853808440eaade4f53ce70d3515/%E5%8F%97%E4%BB%98.png?w=1200&amp;h=959\" alt=\"受付\" width=\"1200\" height=\"959\">\u003C/figure>\u003Ch4 id=\"h0087f1f435\">\u003Cbr>\u003Cstrong>現地での判断と難しさ\u003C/strong>\u003C/h4>\u003Cp>各パビリオン前の\u003Cstrong>管理表\u003C/strong>には、\u003Cstrong>アクティビティの集合時間や定員、対象年齢、必要な持ち物などの最新情報が掲示\u003C/strong>されており、これをもとにその場で判断しなければいけません。\u003C/p>\u003Cp>館内ではアプリでも情報を確認できますが、表示には遅延があるため、現地ではこの管理表の情報が基準になります。目の前で受付が締め切られることも珍しくなく、現地では泣き出す子どもや焦る親の姿も見かけます。\u003C/p>\u003Cp>予約を取るとその時間に縛られ、合間にできる仕事がかなり限られてしまう一方で、予約をしないと人気のアクティビティはほとんど取れません。\u003C/p>\u003Cp>このため、\u003Cstrong>常に「今予約を取るべきか」「別の仕事を先にやるべきか」を判断\u003C/strong>し続けなければいけません。\u003Cbr>ここでも\u003Cstrong>親のマネジメント力\u003C/strong>が問われるわけです。\u003C/p>\u003Ch3 id=\"h30aa01c3c5\">お仕事の流れ\u003C/h3>\u003Cp>アクティビティの時間になると、\u003Cstrong>制服\u003C/strong>に着替えて仕事が始まります。\u003C/p>\u003Cp>パビリオンごとに内容はさまざまで、例えばニンテンドーのパビリオンでは、Switch のゲーム制作ができるゲームソフトを使って、キャラクターの色を変えたり背景を調整したりといった作業を行っていました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/da6dd2f6ae874fcb808ec68a2cd8417e/%E4%BD%9C%E6%A5%AD%E3%81%AE%E6%A7%98%E5%AD%90.png?w=1200&amp;h=866\" alt=\"作業の様子\" width=\"1200\" height=\"866\">\u003C/figure>\u003Cp>\u003Cbr>JRA では馬のアニマトロニクスに餌をあげる体験や触れ合いができたり、デパートでは\u003Cstrong>年齢によって役割\u003C/strong>が変わり、小さい子は品出し、大きい子はラッピングを担当するなど、\u003Cstrong>同じパビリオンでも内容に違い\u003C/strong>があります。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"haa60f8fdcd\">\u003Cstrong>報酬とお土産\u003C/strong>\u003C/h4>\u003Cp>多くのアクティビティでは、\u003Cstrong>終了後にお土産\u003C/strong>がもらえます。\u003Cbr>例えば RF1 のパビリオンでは\u003Cstrong>作ったサラダ\u003C/strong>を持ち帰ることができ、Zoff では自分で\u003Cstrong>組み立てたメガネ\u003C/strong>をそのまま持ち帰れました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/e3dfc808700b4f49ac05e381902876cd/%E3%82%B5%E3%83%A9%E3%83%80%E4%BD%9C%E3%82%8A.png?w=900&amp;h=553\" alt=\"サラダを作っている様子\" width=\"900\" height=\"553\">\u003C/figure>\u003Cp>\u003Cbr>加えて\u003Cstrong>報酬としてキッゾも支給\u003C/strong>され、ほとんどの仕事で 10 キッゾがもらえます。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"h5f5fe1b02f\">\u003Cstrong>キッゾの使い道\u003C/strong>\u003C/h4>\u003Cp>稼いだキッゾは、館内でいくつかの使い道があります。\u003C/p>\u003Cp>\u003Cstrong>三井住友銀行のブースでは口座を作って預ける\u003C/strong>ことができ、キャッシュカードを使ってATMから引き出すことも可能です。利子もつきます。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/7fc823af523344fbb008c5afdb6530bb/%E9%8A%80%E8%A1%8C.png?w=900&amp;h=569\" alt=\"銀行\" width=\"900\" height=\"569\">\u003C/figure>\u003Cp>\u003Cbr>一方で、\u003Cstrong>デパートなどで商品を購入\u003C/strong>することもできますが、価格はやや高めです。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f6a8c7857cc84bbf8c3dc8a713d904cc/%E3%83%87%E3%83%91%E3%83%BC%E3%83%88.png?w=900&amp;h=551\" alt=\"デパート\" width=\"900\" height=\"551\">\u003C/figure>\u003Cp>\u003Cbr>また、\u003Cstrong>一部のアクティビティではキッゾを使って体験や飲食\u003C/strong>をすることもできます。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"ha0066fba9c\">\u003Cstrong>体験中の様子と写真\u003C/strong>\u003C/h4>\u003Cp>館内では大人は基本的にアクティビティの中には入れませんが、外から様子を見ることができる場所が多く、写真を撮ることに忙しくなります。\u003Cbr>気づくとあっという間に時間が過ぎていきます。\u003C/p>\u003Cp>こうして仕事をこなしていくと、Jobスケジュールカードが埋まっていきます。\u003Cbr>「写真撮影」のマークがついているアクティビティでは、スタッフが撮影した写真を後から購入することもできます。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/0b8b415c213c44729c1caaf664def64e/%E5%9F%8B%E3%81%BE%E3%81%A3%E3%81%A6%E3%81%84%E3%81%8F%E3%82%B9%E3%82%B1%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB%E3%82%AB%E3%83%BC%E3%83%89.png?w=800&amp;h=729\" alt=\"埋まっていくスケジュールカード\" width=\"800\" height=\"729\">\u003C/figure>\u003Ch2 id=\"ha214098e44\">まとめ\u003C/h2>\u003Cp>キッザニアは一見するとテーマパークですが、実際には\u003Cstrong>「時間」と「予約」をどう扱うかで体験の質が大きく変わる場所\u003C/strong>です。\u003C/p>\u003Cp>子どもが主体となって動く仕組みである一方で、\u003Cstrong>限られた時間の中での体験の組み立て\u003C/strong>は、親のマネジメントにも大きく関わってきます。\u003Cbr>事前に流れを理解しておくだけでも、当日の動きやすさは大きく変わります。\u003C/p>\u003Cp>なお、キッザニアは子ども向けの施設ですが、\u003Ca href=\"https://www.kidzania.jp/tokyo/news/17255\" target=\"_blank\" rel=\"noopener noreferrer\">16歳以上の学生向けイベント\u003C/a>や、\u003Ca href=\"https://www.kidzania.jp/tokyo/news/17087\" target=\"_blank\" rel=\"noopener noreferrer\">大人向けに開放される企画\u003C/a>が実施されるなど、通常とは違った形で体験できる機会もあるようです。\u003C/p>\u003Cp>これからキッザニアに行ってみる予定がある方は、行く前の参考になれば幸いです。\u003C/p>",{"url":10,"height":11,"width":12},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/e3dfc808700b4f49ac05e381902876cd/%E3%82%B5%E3%83%A9%E3%83%80%E4%BD%9C%E3%82%8A.png",691,1124,[14,21,27],{"id":15,"createdAt":16,"updatedAt":17,"publishedAt":18,"revisedAt":17,"name":19,"top":20},"tea","2023-06-01T09:41:19.770Z","2025-04-22T12:20:26.123Z","2023-07-28T06:30:00.000Z","お茶会",true,{"id":22,"createdAt":23,"updatedAt":24,"publishedAt":23,"revisedAt":23,"name":25,"top":26},"parenting","2023-08-07T11:28:34.052Z","2023-08-09T06:17:18.788Z","子育て",false,{"id":28,"createdAt":29,"updatedAt":30,"publishedAt":29,"revisedAt":29,"name":31,"top":26},"money","2023-07-13T01:35:18.003Z","2023-08-09T06:21:43.560Z","お金",{"contents":33,"totalCount":62,"offset":63,"limit":64},[34,44,52],{"id":35,"eyecatch":36,"publishedAt":40,"createdAt":41,"title":42,"is_html":26,"content2":43},"family-day-2",{"url":37,"height":38,"width":39},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/e200383b554240bcb7aa4391e2b66d2d/family-day2-11.png",433,650,"2024-09-05T07:42:22.000Z","2024-08-27T05:23:39.742Z","【Family Day】シルクスクリーンプリント ワークショップ第二弾","\u003Cp>秋らしく過ごしやすい季節となってまいりました。皆様お元気でお過ごしでしょうか。\u003Cbr>夏の疲れが出ませんよう、御身おいといください。\u003C/p>\u003Cp>先日、\u003Cstrong>第二回目となるファミリーデーを開催\u003C/strong>しました。\u003Cbr>今回は参加家族も増え、さらに賑やかな一日となりました。その様子をお伝えしたいと思います！\u003Cbr>\u003Cbr>前回の様子はこちら。\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.s2factory.co.jp/blog/family-day/\" data-iframely-url=\"//cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Fwww.s2factory.co.jp%2Fblog%2Ffamily-day%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"//cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Ch2 id=\"h443c1abcb4\">第二回に向けて\u003C/h2>\u003Cp>\u003Cstrong>前回のファミリーデーが好評だったため、第二回目の開催が決定\u003C/strong>しました。\u003Cbr>\u003Cbr>参加者からのリクエストも多く、再び\u003Cstrong>シルクスクリーンプリンター \u003C/strong>\u003Ca href=\"https://handerude.studio.site/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">\u003Cstrong>handerude\u003C/strong>\u003C/a> を使った\u003Cstrong>シルクスクリーンプリントのワークショップをメイン\u003C/strong>のアクティビティとして採用。\u003Cbr>\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://handerude.studio.site/\" data-iframely-url=\"//cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Fhanderude.studio.site%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"//cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Cp>\u003Cstrong>参加家族が増え、規模が拡大\u003C/strong>したこともあり、\u003Cstrong>前回のポーチやサコッシュに加え、Tシャツ、巾着袋、お道具箱といった新しいアイテムを用意\u003C/strong>し、色々なアイテムの中から好きなものを選んでもらえるようにしました。\u003Cbr>\u003Cbr>プログラムは下の通りです。\u003C/p>\u003Cul>\u003Cli>\u003Cstrong>11:00-12:00 シルクスクリーンWS 前半\u003C/strong>\u003Cul>\u003Cli>絵を描く\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>12:00-13:00 ランチ\u003C/strong>\u003Cul>\u003Cli>フィルムに絵を印刷\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>13:00-15:30 シルクスクリーンWS 後半\u003C/strong>\u003Cul>\u003Cli>プリント準備\u003C/li>\u003Cli>印刷\u003C/li>\u003C/ul>\u003C/li>\u003C/ul>\u003Cp>スムーズな進行とすべての参加者が楽しめるよう、万全を期して準備を進めました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f5353ef91616491c9ed1c36f979066c9/WS2.jpg\" alt=\"ワークショップの教材\" width=\"650\" height=\"478\">\u003Cfigcaption>ワークショップの教材\u003C/figcaption>\u003C/figure>\u003Ch2 id=\"h4261133abc\">当日の様子\u003C/h2>\u003Cp>11時に全員集合！\u003Cbr>自己紹介を済ませたら、プリントの下地となるデザインを早速みんなで描いてもらいました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/21d13f4dfc9c4170a793cab3b018474c/family-day2-1.jpg?w=650&amp;h=487\" alt=\"お絵描き中\" width=\"650\" height=\"487\">\u003Cfigcaption>印刷用のデザインを描いているところ\u003C/figcaption>\u003C/figure>\u003Cp>\u003Cbr>何を描けばいいのか悩んでいる子もいれば、どんどん描き進める子もいて、なんだか懐かしかったです。\u003Cbr>\u003Cstrong>図画工作や美術の授業を思い出しました。\u003C/strong>\u003Cbr>\u003Cbr>鉛筆で下書きしたものをマジックでなぞって、\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/a0688dbbf7464a93baeab155d9cf7796/family-day2-3.png\" alt=\"鉛筆で描いた下書きをなぞる\" width=\"650\" height=\"433\">\u003C/figure>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/91f7a9feae824a97b973de8f46bc1cf1/family-day2-2.png\" alt=\"完成したデザイン\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>なぞったデザインはスキャンして PC に取り込み、パスに変換します。\u003Cbr>\u003Cbr>その後、handerude を使用して専用のフィルムにデザインをプリント。\u003Cbr>\u003Cstrong>デザインの描かれた部分には細かい隙間(穴)が作られ、そこを通してインクが布にプリントされる仕組み\u003C/strong>です。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/82769f57b2d9467196c96f11c5686159/family-day2-4.png\" alt=\"印刷中\" width=\"650\" height=\"433\">\u003C/figure>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/989750a30c4e4beb8a9a8791e85e2e4c/family-day2-5.png\" alt=\"フィルムに印刷される様子\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>印刷に時間がかかるのでその間にランチタイム。\u003Cbr>ランチが終わると、オフィスの 2 階にあるリラックスルームで漫画を読んだりカードゲームで遊んだりしてプリントが終わるのを待ちました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/31883fcc9576431d9101f663695d3367/family-day2-6.png\" alt=\"プリント待機中\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>いよいよシルクスクリーンプリントです。\u003Cbr>フレームにフィルムを固定し、プリントしたい位置に合わせ、好きな色のインクを乗せたら一気に\u003Cstrong>ヘラ(スキージー)で上から下にインクを伸ばします\u003C/strong>。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/2d5bd7aea6c0494795540b581741fac6/family-day2-7.png\" alt=\"インクを載せる\" width=\"650\" height=\"433\">\u003C/figure>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/1d4463a08fac4dc2b9b5fea202c93e00/family-day2-8.png\" alt=\"シルクスクリーンプリント印刷\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>前回より教える側も慣れているので 3 色刷りや、塗りの上に線もプリントしてみました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/46710ea9ea07442f84dd378add7b7c90/family-day2-10.png\" alt=\"3色プリントに挑戦\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>完成したものがこちら。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/e200383b554240bcb7aa4391e2b66d2d/family-day2-11.png\" alt=\"完成したTシャツ\" width=\"650\" height=\"433\">\u003Cfigcaption>どこかで見たことある青い鳥\u003C/figcaption>\u003C/figure>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/6061f23f3dbc468b8c1210bed6dd295a/family-day2-12.png\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>綺麗に印刷できました！\u003Cbr>そしたらこれをドライヤーで乾かし、最後にアイロンを使って定着させれば完成です。\u003Cbr>\u003Cbr>詳しい工程については\u003Ca href=\"https://www.s2factory.co.jp/blog/family-day/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">第一回目のブログ\u003C/a>をご覧になってみてください。\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.s2factory.co.jp/blog/family-day/\" data-iframely-url=\"//cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Fwww.s2factory.co.jp%2Fblog%2Ffamily-day%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"//cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Cp>\u003C/p>\u003Ch3 id=\"ha214098e44\">まとめ\u003C/h3>\u003Cp>今回のファミリーデーでは、さらに多くの家族に参加していただき、賑やかで楽しい時間を過ごすことができました。\u003Cbr>\u003Cbr>みんなそれぞれ自分の作品を完成させ、満足そうな表情が見られてよかったです。\u003Cstrong>子供達同士で作品を見せ合って、楽しそうにしている姿も印象的\u003C/strong>でした。\u003Cbr>\u003Cstrong>新しいことに挑戦しながら、みんなが楽しい時間を過ごせたのが今回の一番の成果\u003C/strong>だと思います。\u003C/p>\u003Cp>待ち時間には、家族同士だけでなく、社員との交流も広がり、普段は見せられない仕事場を紹介できたことも貴重な機会でした。\u003Cbr>家族がオフィスの環境を知り、社員とのつながりも感じられたことが、イベント全体をさらに充実したものにしてくれました。\u003C/p>\u003Cp>次回も、\u003Cstrong>参加者全員が楽しめる内容を考え、家族同士や社員との交流を深められるイベントを目指していきたい\u003C/strong>と思います。\u003C/p>",{"id":45,"eyecatch":46,"publishedAt":48,"createdAt":49,"title":50,"is_html":26,"content2":51},"family-day",{"url":47,"height":38,"width":39},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/8c872afc48454b65840550ed9787dc17/WS17.JPG","2024-04-05T07:42:28.000Z","2024-03-26T07:35:45.500Z","【Family Day】シルクスクリーンプリント ワークショップ","\u003Cp>春雨の降り続くこの頃、お変わりありませんでしょうか。\u003Cbr>躍動の春に、皆様のますますのご活躍を心よりお祈りいたします。\u003Cbr>\u003Cbr>先日、S2 で初の\u003Cstrong>ファミリーデーを開催\u003C/strong>しました。\u003Cbr>ということで、ファミリーデーについて報告したいと思います。\u003C/p>\u003Ch2 id=\"hd2c91c24e4\">経緯\u003C/h2>\u003Cp>昨年の夏、S2 グッズを量産していく目的で、\u003Cstrong>シルクスクリーンプリンター \u003C/strong>\u003Ca href=\"https://handerude.studio.site/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">\u003Cstrong>HANDERUDE\u003C/strong>\u003C/a>\u003Cstrong> を購入\u003C/strong>しました。\u003Cbr>HANDERUDE はとても小型な上、プリント用のフィルムを作成するのに感光乳剤を洗い流す必要もなく、簡単に製版ができる画期的なマシーンです。\u003Cbr>\u003Cbr>グッズ制作を目的に購入しましたが、\u003Cstrong>スタッフ誰でも何か作ったりするのに使えれば\u003C/strong>ということで、ワークショップを計画することに。\u003Cbr>ちょうど\u003Cstrong>新しいオフィスに引っ越した\u003C/strong>タイミングだったので、せっかくならスタッフだけでなく、\u003Cstrong>スタッフの家族も招待してファミリーデーという形で実施する\u003C/strong>のがいいのでは。という話になり、ファミリーデーを開催する運びとなりました。\u003C/p>\u003Ch2 id=\"h79a8167fa2\">ファミリーデーに向けて\u003C/h2>\u003Cp>ファミリーデーの準備と実施は、\u003Ca href=\"https://www.s2factory.co.jp/blog/interview-5/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">以前インタビューで紹介したデザイナーの松江と山田\u003C/a>が中心となって行いました。\u003C/p>\u003Cp>※こちらのインタビュー記事もぜひご覧になってみてください。\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.s2factory.co.jp/blog/interview-5/\" data-iframely-url=\"//cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Fwww.s2factory.co.jp%2Fblog%2Finterview-5%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"//cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Cp>\u003Cbr>内容は下の通り。メインはシルクスクリーンのワークショップです。\u003C/p>\u003Cul>\u003Cli>\u003Cstrong>12:00-13:00 昼食\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>13:00-13:30 オフィスツアー\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>13:30-15:30 シルクスクリーンWS\u003C/strong>\u003Cul>\u003Cli>絵を描く\u003C/li>\u003Cli>版の印字\u003C/li>\u003Cli>プリント体験\u003C/li>\u003C/ul>\u003C/li>\u003C/ul>\u003Cp>事前に参加者数に応じた対応を確認するための模擬ワークショップを行い、適切な運営方法を確認。\u003Cbr>スタッフの子供たちも参加することを考慮し、退屈しないようなアクティビティや内容を計画しました。\u003Cbr>\u003Cbr>簡単な教材の準備やタイムスケジュールの管理、安全対策にも気を配り、参加者全員が楽しく学べる環境を整えました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f5353ef91616491c9ed1c36f979066c9/WS2.jpg\" alt=\"教材２\" width=\"650\" height=\"478\">\u003Cfigcaption>手作り教材。\u003C/figcaption>\u003C/figure>\u003Ch2 id=\"h1452651df4\">当日\u003C/h2>\u003Cp>当日は予定通り、ランチに始まり、オフィスツアーを行いました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/6d0ff43434c84c1bbd9ae788a5904272/WS3.png\" alt=\"オフィスツアーの様子\" width=\"650\" height=\"488\">\u003Cfigcaption>なんと地下室があります。\u003C/figcaption>\u003C/figure>\u003Cp>\u003Cbr>オフィスツアー後は、いよいよメインのワークショップです。\u003Cbr>今回は、\u003Cstrong>サコッシュ\u003C/strong>と\u003Cstrong>ポーチ\u003C/strong>のどちらかを選んでもらってプリントすることにしました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/c73efa2371494bb59a3b2867a4ec6b4f/WS4.jpg\" alt=\"ワークショップの様子\" width=\"650\" height=\"488\">\u003Cfigcaption>ミーティングルームでWSを行いました。\u003C/figcaption>\u003C/figure>\u003Ch3 id=\"he9b2159fc3\">シルクスクリーンプリントのやり方\u003C/h3>\u003Cp>HANDERUDE を使ったシルクスクリーンプリントは以下の工程で行われます。\u003C/p>\u003Col>\u003Cli>\u003Cstrong>絵を描く\u003C/strong>\u003Cp> \u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/cba4f723901c4cb1b80f2324b4008f43/WS5.jpeg\" alt=\"絵を描く\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>絵をスキャナで PC に取り込む\u003C/strong>\u003Cbr>　\u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/3ae5a3638c2c47a59e56663c0ae806f0/WS6.jpeg\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>HANDERUDE に専用の製版フィルムをセットし、絵のデータを PC から送信する\u003C/strong>\u003Cbr>　\u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/8b308094c47647898336958c52ade129/WS7.jpeg\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>フィルムに製版する\u003C/strong>\u003Cbr>　\u003Cbr>\u003Cdiv style=\"max-width: 56vh;\">\u003Cdiv style=\"left: 0; width: 100%; height: 0; position: relative; padding-bottom: 177.7778%;\">\u003Ciframe src=\"https://www.youtube.com/embed/1GHbzJgZVrI\" style=\"top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;\" allowfullscreen scrolling=\"no\" allow=\"encrypted-media;\">\u003C/iframe>\u003C/div>\u003C/div>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>製版したフィルムをフレームに固定\u003C/strong>\u003Cbr>\u003Cstrong>　\u003C/strong>\u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/2aebe436878442a4867be7dfa1c9cae6/WS8.jpeg\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>素材をセッティングし、刷る位置を決める\u003C/strong>\u003Cbr> \u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/fa23e2239d2444b38873675405e366a0/WS9.jpeg\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>好きな色のインクをフィルムに乗せる\u003C/strong>\u003Cbr>\u003Cstrong> 　\u003C/strong>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f238a7f374514439aa41fb4de80ea331/WS10.jpg\" alt=\"\" width=\"650\" height=\"531\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>ヘラ(スキージー)で上から下にインクを伸ばす\u003C/strong>\u003Cp>　\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/b8db1dd3b3b440c693094c5376668b83/WS11.jpg\" alt=\"\" width=\"650\" height=\"448\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>印刷したものをドライヤーで乾かす\u003C/strong>\u003Cbr>  　\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/496bda308207456d834572a7158b5876/WS12.jpg\" alt=\"\" width=\"650\" height=\"512\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>仕上げにアイロンをかけてプリントを定着させる\u003C/strong>\u003Cbr> \u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/b92dfd01601e41fa824c7936060d5fae/WS13.jpg\" alt=\"\" width=\"650\" height=\"433\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cbr>\u003C/p>\u003C/li>\u003Cli>\u003Cstrong>完成！\u003C/strong>\u003Cbr>\u003Cstrong> \u003C/strong>\u003Cbr>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/abca7695bf6946d3bfce39a9c3c4a682/WS14.jpeg\" alt=\"\" width=\"4013\" height=\"2741\">\u003C/figure>\u003Cp>\u003Cbr>\u003C/p>\u003C/li>\u003C/ol>\u003Cp>子供たちのワークショップが終わってから大人たちも体験。\u003Cbr>全員上手くできました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/cb0b07c0ae7a43b9ad23ab8c1af1ec43/WS15.jpg?w=650&amp;h=767\" alt=\"下書き\" width=\"650\" height=\"767\">\u003C/figure>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/677bd15763124881b187c35c16b940a0/WS16.jpg\" alt=\"\" width=\"650\" height=\"488\">\u003C/figure>\u003Ch2 id=\"ha214098e44\">まとめ\u003C/h2>\u003Cp>普段見ることができない職場の雰囲気や、私たちがどのような仕事をしているかをスタッフの家族に知ってもらう絶好の機会になりました。\u003Cbr>また、子供たちがワークショップを通じてクリエイティブな世界に触れ、少しでも興味を持ってくれたなら幸いです。\u003Cbr>\u003Cbr>そしてすでに、\u003Cstrong>ファミリーデー第 2 回も計画中！\u003C/strong>\u003Cbr>\u003Cstrong>次回はプログラミングのワークショップ\u003C/strong>をする予定らしいです。\u003Cbr>\u003Cbr>オフィスが新しくなったおかげで、できることも増えました。\u003Cbr>今後も様々なことに\u003Cstrong>チャレンジ\u003C/strong>していきたいと思います。\u003C/p>",{"id":53,"eyecatch":54,"migration_date":58,"publishedAt":59,"createdAt":59,"title":60,"is_html":20,"html_contents":61},"allowance",{"url":55,"height":56,"width":57},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/fd46f7f2f2f3450786d6c95e37823b25/2021-07-otsukai_okodukai.png",800,775,"2021-07-06T18:25:14+09:00","2023-06-02T08:49:09.759Z","キャッシュレスお小遣いアプリをつくった話","最近腰が痛くて仕方ありません。おまけに肩甲骨に痺れを感じます。症状をネットで検索すると頸椎症性神経根症というのがヒットしたのですが、そうなんでしょうか。どうすれば治るんですか…。\u003Cbr>\u003Cbr>今回は弊社のある社員が\u003Cstrong>「キャッシュレスお小遣いアプリをつくった話」\u003C/strong>をしました。\n\n\u003Chr class=\"wp-block-separator\"/>\n\n\n\u003Cbr>子供がお手伝いをした時に、これまではシールやスタンプを与えるようにしていたのですが、それではさすがに釣れなくなってきました。\u003Cbr>そろそろお金のことを勉強し始めた方がいいのかもしれないなーと思うところもあったので、現金を与えることにしたのですが、どうやって支給しようか色々考えました。今回はその話をしようと思います。\u003Cbr>\u003Cbr>\n\n\u003Ch2>お小遣いの導入\u003C/h2>\n\nお小遣いというと、月々いくらとか固定の金額(固定給)を与えることもあると思うのですが、何もやっていないのにお金がもらえるなんて虫が良すぎると思ったため我が家では歩合で与えることにしました。\u003Cbr>\u003Cbr>\u003Cstrong>お小遣いを得る手段\u003C/strong>としては、\u003Cbr>\u003Cbr>\n\n\u003Cul>\u003Cli>\u003Cstrong>手伝い\u003C/strong>\u003Cul>\u003Cli>\u003Cstrong>家事\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>親の背中を踏む\u003C/strong>\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>テストの結果\u003C/strong>\u003Cul>\u003Cli>\u003Cstrong>基本は満点のみ\u003C/strong>\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>苦手なことを強いられたとき\u003C/strong>\u003Cul>\u003Cli>\u003Cstrong>買い物に付き合う\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>留守番\u003C/strong>\u003C/li>\u003C/ul>\u003C/li>\u003C/ul>\n\n\u003Cbr>などなど。\u003Cbr>うちの子は買い物に付き合うのも留守番するのも苦手なため、\u003Cstrong>買い物に行くとなったら必然的にお小遣いが発生してしまう\u003C/strong>のが微妙なところではありますが、大体こんな感じです。\u003Cstrong>良い行動をすればお小遣いがもらえる\u003C/strong>ように設定しています。\u003Cbr>\u003Cbr>親としては良い行動をたくさんとっていっぱい稼いでもらっていいのですが、そうすると小銭を常にストックしておかなければいけません。しかし今はもう圧倒的に\u003Cstrong>キャッシュレスの時代\u003C/strong>です。\u003Cbr>\u003Cbr>私の家でも夫婦ともにおサイフケータイやQRコード決済、それらが使えなければクレジットカードを使うといった感じでほぼ現金を使うことがありません。故に小銭が発生しない。そんなわけで\u003Cstrong>お小遣いもキャッシュレス\u003C/strong>で与えることにしました。\u003Cbr>\u003Cbr>\n\n\u003Ch2>キャッシュレスお小遣いアプリ\u003C/h2>\n\nどういう方法かというと、ポイントカードを想像してもらえばいいと思います。ポイントカードを用意して、お手伝いするごとにそこにポイントを足していくイメージです。\u003Cbr>\u003Cstrong>追加要素として、独自のレートを親が決めておいて、それに則って引き出せるようにしています\u003C/strong>。「最近頑張ってお小遣い稼いでるな」となるとレート上げてみたり。\u003Cstrong>多く発行されるものは価値が下がっていく。というのをリアルに体感できる\u003C/strong>ようになっています。なので 1 ポイントが 1 円になるわけではありません。\u003Cbr>\u003Cbr>スタンプ帳や通帳などで管理するのが一般的かなーとも考えたのですが、どちらもちょっとめんどくさそうに思えたので\u003Cstrong>アプリを作る\u003C/strong>ことにしました。\u003Cbr>\u003Cbr>\u003Cbr>\u003Cstrong>要件\u003C/strong>\u003Cbr>\n\n\u003Cul>\u003Cli>\u003Cstrong>QR の読み取りによって入金・出金ができる\u003C/strong>\u003Cul>\u003Cli>\u003Cstrong>親のQR決済を見ていたのでやってみたくなるかも\u003C/strong>\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>ローカルで完結\u003C/strong>\u003Cul>\u003Cli>\u003Cstrong>バックエンドを作るのさすがに面倒\u003C/strong>\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>iOS\u003Ca href=\"https://support.apple.com/kb/SP796?viewlocale=ja_JP&amp;locale=ja_JP\" target=\"_blank\" rel=\"noreferrer noopener\">(iPod Touch 7th\u003C/a>)\u003C/strong>\u003C/li>\u003C/ul>\n\n\u003Cbr>\u003Cbr>要件は以上です。\u003Cbr>\u003Cbr>時間をかけずにサクッと作ってしまいたいということで、実装は \u003Ca rel=\"noreferrer noopener\" href=\"https://flutter.dev/\" target=\"_blank\">\u003Cstrong>Flutter\u003C/strong>\u003C/a> で。\u003Cbr>親は子供と同じアプリを自分のスマホで起動し、アプリ上で隠しコマンドを入力。するとポイント入力・送信のページに進むことができます。そこで金額とテキストを入力し、 \u003Ccode>${amount}:${text}\u003C/code> というフォーマットのQRコードを発行。子供が QR コードをスマホで読み取ると、それを記録しつつ残高を増減させる機能を作りました。\u003Cbr>こうして\u003Cstrong>QR決済ごっこアプリが完成\u003C/strong>。\u003Cbr>\u003Cbr>こちらが\u003Cstrong>デモ\u003C/strong>です。\u003Cbr>\u003Cbr>\n\n\u003Ciframe width=\"367\" height=\"653\" src=\"https://www.youtube.com/embed/Y_OqJihSXOA\" title=\"2022/7/6 お茶会動画①\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen>\u003C/iframe>\n\n\u003Cbr>\n\n\u003Ciframe width=\"367\" height=\"653\" src=\"https://www.youtube.com/embed/th76lN6k5Rg\" title=\"2022/7/6 お茶会②\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen>\u003C/iframe>\n\n\u003Cbr>\u003Cbr>もらうのところを長押しすると、ポイント入力・送信画面が出てきます。OKするとQRコードが作成され、それを読み込むとポイントが追加されるという仕組みです。\u003Cbr>\u003Cbr>\n\n\u003Ch3>問題点と解決方法\u003C/h3>\n\n一年間これで運用してみたのですが、\u003Cbr>\u003Cbr>\n\n\u003Cul>\u003Cli>\u003Cstrong>スマホを常用していない子供にとってお小遣いをもらうためにスマホを準備するのが面倒\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>親もQRを発行して子供に読み込ませる必要があるのでタイミングを合わせないといけない\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>お小遣いを使う機会が少なくて「お小遣いを貯めること」が手伝いをするモチベーションにつながらない\u003C/strong>\u003C/li>\u003C/ul>\n\n\u003Cbr>などの問題点が浮き彫りに。\u003Cbr>これらを踏まえて\u003Cstrong>Version2を制作\u003C/strong>することにしました。\u003Cbr>\u003Cbr>元々、子供にとって面白いかなと思ってQRコードを読み取るプロセスを挟んでいたのですが、問題点に挙げたようにこれが双方結構手間だったので\u003Cstrong>親が操作するだけでポイントを付与\u003C/strong>できるよう変更。\u003Cbr>さらに、お手伝いをしてお小遣いが発生することで、\u003Cstrong>お金だけじゃなく別のモチベーションも追加\u003C/strong>することにしました。\u003Cbr>\u003Cbr>\n\n\u003Ch3>Version2 実装\u003C/h3>\n\nお金はかけたくなかったので、バックエンドは\u003Ca rel=\"noreferrer noopener\" href=\"https://firebase.google.com/?hl=ja\" target=\"_blank\">Firebase\u003C/a>、データベースには \u003Ca rel=\"noreferrer noopener\" href=\"https://firebase.google.com/docs/firestore/quickstart?hl=ja\" target=\"_blank\">Cloud Firestore\u003C/a>を、親の UI は Web で JS から Firestore に書き込むようにして、ホスティングも Firebase のホスティング無料枠を使うことにしました。これで全て無料で賄えます。\u003Cbr>\u003Cbr>モチベーションについては、\u003Cstrong>お手伝いする度にポイントと一緒に子供の好きなキャラクターをランダムでゲットしてコレクションできる仕組み\u003C/strong>を作ってみました。つまり、\u003Cstrong>ポイントと同時にアプリ内でガチャが回せるような仕組みで射幸心を煽る\u003C/strong>わけです。\u003Cbr>\u003Cbr>ポイント入力画面から詳細を入力して送信しておけば、子供がアプリを開いた時にキャラクター獲得の簡単なアニメーションが入り、ポイントがチャージされるようになっています。\u003Cbr>\u003Cbr>\u003Cbr>\n\n\u003Cdiv class=\"wp-block-image\">\u003Cfigure class=\"aligncenter size-large is-resized\">\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/afb5eff1f551442db369b94888a08445/2021-07-48d3bf7e99c2a082c3af1146f738c333.png\" alt=\"\" class=\"wp-image-12126\" width=\"794\" height=\"197\"/>\u003C/figure>\u003C/div>\n\n\u003Cbr>\u003Cbr>コレクションしたキャラクターは一覧で見れるようにしてあって、それぞれタップすると、いつ何をやった時のポイントでゲットしたとかの詳細が確認できます。ちなみにですが、\u003Cstrong>子供が好きなキャラクターはレア度を高めに設定\u003C/strong>してあるのでなかなかゲットできません。\u003Cbr>\u003Cbr>\u003Cbr>\n\n\u003Cdiv class=\"wp-block-image\">\u003Cfigure class=\"aligncenter size-medium\">\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/165596b690484d889591aadf3555692f/2021-07-14396aa489d29f9a90ed1da6b2324025.png\" alt=\"\" class=\"wp-image-12130\"/>\u003C/figure>\u003C/div>\n\n\u003Cbr>\u003Cbr>実装するのにかかったのは6時間ぐらい。\u003Cbr>キャラクターをゲットするのがうまくモチベーションになってくれたみたいで、\u003Cstrong>単価の低い作業も頻繁にやるようになりました。\u003C/strong>というわけで次のバージョンを考えています。\u003Cbr>\u003Cbr>\n\n\u003Ch3>Version2.1 へ\u003C/h3>\n\n次回のアップデートではこの辺りに対応する予定です。\u003Cbr>\u003Cbr>\n\n\u003Cul>\u003Cli>\u003Cstrong>キャラの重複防止\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>図鑑機能\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>PUSH通知\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>デザイン\u003C/strong>\u003C/li>\u003C/ul>\n\n\u003Cbr>1000種類ぐらいのキャラクターデータがあるのでまあかぶらないだろうと思って何もしていなかったのですが、これからのことを考えたら対処が必要だなあと思っています。また、コレクションも現在は獲得順に表示しているだけなのですが、キャラクターに番号をつけたり説明を入れてもっと図鑑っぽくしたり、また、ゲットしたものはハイライトで表示させたりしようかなと。\u003Cbr>これができれば素敵なアプリに仕上がるんじゃないでしょうか。もう少し先の話になるかもしれませんが、後々は\u003Cstrong>ポイントを現金に変えられるような仕組み\u003C/strong>も入れられればと考え中です。\u003Cbr>\u003Cbr>\u003Cbr>ということで、\u003Cbr>\n\n\u003Cp class=\"has-text-align-center\" style=\"font-size:19px; text-align: center\">\u003Cbr>\u003Cstrong>\u003Cspan class=\"has-inline-color has-pale-pink-color\">[PR]あなたのご家庭専用に本システムをセットアップいたします\u003C/span>\u003C/strong>\u003C/p>\n\n\u003Cp class=\"has-text-align-center\" style=\"text-align: center\">\u003Cstrong>情報と画像をご用意いただければ色々とカスタマイズが可能です。\u003Cbr>費用については予算に合わせてのご提案も可能ですので、気軽に\u003Ca rel=\"noreferrer noopener\" href=\"https://www.s2factory.co.jp/contact\" target=\"_blank\">ご相談\u003C/a>ください！\u003C/strong>\u003Cbr>\u003Cbr>\u003C/p>\n\n\u003Cdiv class=\"wp-block-image\">\u003Cfigure class=\"aligncenter size-large is-resized\">\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/d27e5db2b9354b86bb5200da6f285e70/2021-07-S2-char_base.png\" alt=\"\" class=\"wp-image-12147\" width=\"225\" height=\"250\"/>\u003C/figure>\u003C/div>",4,0,3,{"contents":66,"totalCount":97,"offset":63,"limit":64},[67,77,87],{"id":68,"eyecatch":69,"publishedAt":73,"createdAt":74,"title":75,"is_html":26,"content2":76},"ux-certification-basics",{"url":70,"height":71,"width":72},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/81c9f7a9fe274d6191ae67e096f7daf2/UX.jpg",2819,4229,"2026-04-16T07:06:01.302Z","2026-04-03T06:01:36.737Z","UX 検定をきっかけに、UX の考え方を整理してみた","\u003Cp>春は無闇に落ち込みます。\u003C/p>\u003Cp style=\"text-align: start\">この記事は、社内イベント「\u003Ca href=\"https://www.s2factory.co.jp/blog/tea/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">\u003Cu>お茶会\u003C/u>\u003C/a>」での発表内容をもとにまとめたものです。\u003Cbr>今回は弊社の yamada が、\u003Cstrong>UX 検定の受験をきっかけに、UX や人間中心設計\u003C/strong>について発表しました。\u003C/p>\u003Chr>\u003Cp style=\"text-align: start\">\u003Cbr>昨年の11月末に、\u003Cstrong>UX 検定(基礎)を受験\u003C/strong>しました。\u003C/p>\u003Cp>名刺の肩書きに UI デザイナーと書いていることもあり、今後この分野でやっていく以上、\u003Cstrong>UX についての知識はきちんと押さえておきたい\u003C/strong>と思い、その手始めとして受けてみました。\u003Cbr>\u003Cbr>今回は UX 検定の内容をもとに、人間中心設計(HCD)や UX の考え方について整理していきます。\u003C/p>\u003Ch2 id=\"h13d8bb8d79\">UX 検定とは\u003C/h2>\u003Cp>\u003Ca href=\"https://www.uxia.or.jp/certification/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>UX 検定\u003C/strong>\u003C/a>\u003Cstrong>は2022年にスタートした比較的新しい資格\u003C/strong>で、\u003Cstrong>UX や人間中心設計(HCD)の知識を体系的に学ぶ\u003C/strong>ことを前提としたものです。 \u003Cbr>\u003Cbr>今回受けた「基礎」は、UX や HCD の考え方を一通り理解しているかを見る位置づけの試験。 \u003Cbr>基礎については試験単体で受験できますが、\u003Cstrong>上位の「応用」は研修の受講が前提\u003C/strong>となっており、試験だけで進めるものではありません。\u003Cbr>\u003Cbr>また、UX 検定とは別に、\u003Cstrong>人間中心設計に関する資格として「専門家」「スペシャリスト」\u003C/strong>といった認定もありますが、こちらは\u003Cstrong>レポート提出や実務での改善実績\u003C/strong>が求められるなど、より実践寄りの内容になっています。現段階ではまだ難しそうだったので今回は見送りました。\u003Cbr>\u003Cbr>なお、\u003Cstrong>UX 検定と人間中心設計に関する資格は、それぞれ別の団体が運営\u003C/strong>しています。 \u003C/p>\u003Ch3 id=\"h0cf6273d17\">試験に向けて\u003C/h3>\u003Cp>試験に向けては、学習推薦図書 4 冊のうち下の 2 冊を読んで臨みました。\u003Cbr>\u003Cbr>\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.amazon.co.jp/%E3%82%A2%E3%83%95%E3%82%BF%E3%83%BC%E3%83%87%E3%82%B8%E3%82%BF%E3%83%AB2-UX%E3%81%A8%E8%87%AA%E7%94%B1-%E8%97%A4%E4%BA%95-%E4%BF%9D%E6%96%87/dp/4296106317\" data-iframely-url=\"https://cdn.iframe.ly/api/iframe?card=small&amp;media=0&amp;url=https%3A%2F%2Famzn.asia%2Fd%2F07NFcB6F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"https://cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.amazon.co.jp/%E4%BA%BA%E9%96%93%E4%B8%AD%E5%BF%83%E8%A8%AD%E8%A8%88%E5%85%A5%E9%96%80-HCD%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA%E3%83%BC-%E5%B1%B1%E5%B4%8E-%E5%92%8C%E5%BD%A6/dp/476490506X\" data-iframely-url=\"https://cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Famzn.asia%2Fd%2F0fd0PoCb&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"https://cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Cp>\u003Cbr>過去問や十分な練習問題は公開されておらず、公式サイトに掲載されているのも問題例が数問ある程度です。 \u003Cbr>そのため、出題形式のイメージを掴みつつ、\u003Cstrong>受験者が作成した予想問題\u003C/strong>も購入して何度か解いて対策。\u003Cbr>\u003Cbr>シラバスも公開されているため、それをもとに AI で内容を整理しながら、全体像を掴むことを意識して進めました。\u003C/p>\u003Ch3 id=\"h25cf28808d\">試験を受けてみて\u003C/h3>\u003Cp>今回はオンラインで自宅から受験しました。\u003Cbr>\u003Cbr>試験自体は、UX や人間中心設計に関する基礎知識が幅広く問われる内容で、特定の分野に偏るというよりも、\u003Cstrong>全体をバランスよく理解しているかを見る印象\u003C/strong>でした。\u003Cbr>\u003Cbr>実際に受けてみると、学習推薦図書からの出題が多かったように思います。\u003Cbr>事前に解いていた予想問題も再現度が高く、個人的にはかなり参考になりました。\u003Cbr>\u003Cbr>\u003Cstrong>結果は項目ごとの得点が表示される形式\u003C/strong>で、どの分野ができていたかは分かる一方で、どこをどう間違えたのかまでは確認できませんでした。 \u003Cbr>無事に合格はできたものの、振り返りのしづらさは少し気になるポイントです。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/2cceb7c904a74dccbb44f00ac01f3678/%E8%A9%A6%E9%A8%93%E7%B5%90%E6%9E%9C.png?w=650&amp;h=581\" alt=\"試験結果\" width=\"650\" height=\"581\">\u003C/figure>\u003Cp>\u003Cbr>\u003Cstrong>合格すると、証書やロゴをダウンロード\u003C/strong>でき、名刺などに掲載することもできます。\u003Cbr>ただ、基礎だと少し物足りなさもあるので、応用に合格した際には使ってみてもいいかもしれません。\u003C/p>\u003Ch2 id=\"h9152cc286e\">UXと人間中心設計について\u003C/h2>\u003Cp>せっかくなので、UX(ユーザーエクスペリエンス)の考え方の土台となる人間中心設計(HCD)についても基本的な考え方を整理しておきます。\u003Cbr>\u003Cbr>UX は\u003Cstrong>「ユーザーがどんな体験をしたか」\u003C/strong>という全体の話で、単に使いやすいかどうかだけではなく、\u003Cstrong>その体験が良かったかどうか\u003C/strong>まで含めて考えます。\u003Cbr>\u003Cstrong>ユーザビリティ(使いやすさ)\u003C/strong>やユーザー視点で課題解決を考える\u003Cstrong>デザイン思考\u003C/strong>といった考え方も含め、その\u003Cstrong>ベースにあるのが人間中心設計(HCD)\u003C/strong>です。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/70d85d9a84f14358a785504abb03148f/UX%E3%81%A8%E4%BA%BA%E9%96%93%E4%B8%AD%E5%BF%83%E8%A8%AD%E8%A8%88%E3%81%AE%E9%96%A2%E4%BF%82%E5%9B%B3.png?w=750&amp;h=409\" alt=\"UXと人間中心設計について\" width=\"750\" height=\"409\">\u003C/figure>\u003Cp>\u003Cbr>人間中心設計は、ユーザーを中心に考えて設計を進めるための考え方やプロセスのことを指します。\u003C/p>\u003Ch3 id=\"h4139147f5a\">HCDサイクルとは\u003C/h3>\u003Cp>人間中心設計には「HCD サイクル」と呼ばれる考え方があります。\u003Cbr>\u003Cbr>これは、\u003Cstrong>使いやすさや体験の質を継続的に改善していくためのプロセス\u003C/strong>です。 \u003Cbr>PDCA サイクルに近い考え方ですが、よりユーザー視点に寄せたものになっています。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/d36a72888d7c4b879b66dc5710b34fe5/Gemini_Generated_Image_cr5u3jcr5u3jcr5u%20(2).png?w=750&amp;h=409\" alt=\"HCDサイクルとは\" width=\"750\" height=\"409\">\u003C/figure>\u003Cp>\u003Cbr>流れとしては、以下のステップを繰り返していきます。\u003C/p>\u003Col>\u003Cli>\u003Cstrong>状況を把握する(ユーザー調査や観察)\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>要求を整理する(要件定義やペルソナ設計)\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>設計して解決案を作る\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>評価する(テストや検証)\u003C/strong>\u003C/li>\u003C/ol>\u003Cp>これを繰り返していくことで、プロダクトを改善していきます。\u003C/p>\u003Cp>こうした改善を進めるうえでは、ユーザビリティをはじめとして、UX に関するさまざまな考え方やモデルを整理して捉えておくことも重要です。ここからは、それらの基本的な概念について順に見ていきます。\u003C/p>\u003Ch3 id=\"hb9c3f7e049\">ユーザビリティ\u003C/h3>\u003Cp>人間中心設計を考えるうえで重要な要素のひとつが「ユーザビリティ」です。\u003Cbr>\u003Cbr>ユーザビリティは、\u003Cstrong>製品やサービスの「使いやすさ」を測るための指標\u003C/strong>で、主に次の3つの観点で捉えられます。\u003C/p>\u003Cul>\u003Cli>有効さ：目的を正しく達成できるか\u003C/li>\u003Cli>効率：少ない手間や時間で達成できるか\u003C/li>\u003Cli>満足度：使っていて不快でないか、納得感があるか\u003C/li>\u003C/ul>\u003Cp>この考え方は、\u003Cstrong>ISO 9241-11 で定義\u003C/strong>されており、ユーザビリティは\u003Cstrong>「特定の利用者が、特定の目的を達成するにあたり、特定の状況で、どれだけ有効・効率的かつ満足できるかの度合い」\u003C/strong>とされています。\u003Cbr>\u003Cbr>このユーザビリティの考え方は1990年代から整理されてきたもので、1998年の ISO 9241-11 をベースに現在の UX の考え方へと発展してきました。\u003C/p>\u003Ch3 id=\"h3fc3754f44\">ユーザーエクスペリエンス\u003C/h3>\u003Cp>\u003Cstrong>ユーザビリティが「ユーザーが目的を達成できたかどうか」を重視\u003C/strong>するのに対し、\u003Cstrong>UX は「その体験が良いものだったかどうか」を重視\u003C/strong>します。\u003Cbr>サービスやプロダクトを認知してから、実際に体験し、その後に振り返るまでの一連の流れすべてがUXに含まれます。\u003Cbr>\u003Cbr>UX にはさまざまな考え方やモデルがありますが、ここではいくつか代表的なものを見てみましょう。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"h381e44aade\">\u003Cstrong>UX のハニカム構造\u003C/strong>\u003C/h4>\u003Cp>\u003Cstrong>UX を構成する要素を 7 つに分けたモデル\u003C/strong>です。\u003Cbr>\u003Cstrong>使いやすさだけでなく、有用性や信頼性、魅力といった観点\u003C/strong>も含まれています。\u003Cbr>\u003Cbr>体験に当てはめると一見当たり前に見えますが、すべてを満たすのは意外と難しく、\u003Cstrong>良い体験を考えるうえで欠かせない基準\u003C/strong>になります。\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/f3167ef6f73a4ab48c0c580a3481a708/%E3%83%8F%E3%83%8B%E3%82%AB%E3%83%A0%E6%A7%8B%E9%80%A0.png\" alt=\"\" width=\"1408\" height=\"768\">\u003C/figure>\u003Cp>\u003C/p>\u003Ch4 id=\"h4416745511\">\u003Cbr>\u003Cstrong>UXの 5 階層モデル\u003C/strong>\u003C/h4>\u003Cp>\u003Cstrong>UXの構成要素を 5 つの層で整理したモデル\u003C/strong>です。\u003C/p>\u003Cul>\u003Cli>戦略：ユーザーのニーズとビジネスの目的 \u003C/li>\u003Cli>要件：必要な機能やコンテンツ \u003C/li>\u003Cli>構造：情報設計や導線 \u003C/li>\u003Cli>骨格：レイアウトやインターフェース \u003C/li>\u003Cli>表層：ビジュアルデザイン\u003C/li>\u003C/ul>\u003Cp>\u003Cstrong>ウェブ構築では、表層のビジュアルだけでなく、その下にある構造や要件まで含めて設計\u003C/strong>する必要があります。\u003Cbr>\u003Cbr>デザイナーは結果としての体験そのものを直接つくることはできませんが、その体験が良くなるように設計することはできます。 つまり、\u003Cstrong>結果ではなく、その手前の設計によってUXを形づくっていくという考え方\u003C/strong>になります。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"he4c02a1baa\">ハッセンツァール\u003Cstrong>モデル\u003C/strong>\u003C/h4>\u003Cp>\u003Cstrong>デザイナー視点とユーザー視点の流れを整理したモデル\u003C/strong>です。\u003Cbr>\u003Cbr>\u003Cstrong>デザイナーは、機能や表現、インタラクションといった「意図された性質」を設計\u003C/strong>します。 \u003Cbr>一方で\u003Cstrong>ユーザーは、それをもとに体験をし、「魅力」や「満足」といった結果\u003C/strong>を受け取ります。\u003Cbr>\u003Cbr>つまり、デザイナーとユーザーでは見ているものが異なります。\u003Cbr>\u003Cbr>デザイナーが直接つくれるのは体験そのものではなく、その手前にある設計の部分です。 \u003Cbr>結果としての体験はユーザー側で生まれるものですが、そこにつながるように設計することはできます。\u003Cbr>\u003Cbr>\u003C/p>\u003Ch4 id=\"h9644a53fee\">\u003Cstrong>UXを時間で捉える(UX白書)\u003C/strong>\u003C/h4>\u003Cp>UX は時間の流れの中でも変化します。\u003C/p>\u003Cul>\u003Cli>予期的 UX：サービスを知ったときに抱く印象や期待 \u003C/li>\u003Cli>一時的 UX：利用しているときの体験 \u003C/li>\u003Cli>エピソード的 UX：利用後の振り返り \u003C/li>\u003Cli>累積的 UX：全体を通して形成される印象 \u003C/li>\u003C/ul>\u003Cp>例えば飲食店であれば、来店前の期待、食事中の体験、帰宅後の満足感まで含めてUXといえます。\u003Cbr>このように、\u003Cstrong>UX は単一の瞬間ではなく、要素・構造・時間の積み重ね\u003C/strong>によって成り立ってるのです。\u003C/p>\u003Ch3 id=\"h0ae0492e09\">デザイン思考\u003C/h3>\u003Cp>いろんな企業や自治体で「デザイン思考」という言葉が使われるようになって久しいですが、これはデザイナーだけのものではなく、さまざまな場面で活用される考え方です。\u003Cbr>デザイン思考では、\u003Cstrong>最初から答えを出そうとするのではなく、課題を探しながら解決していくプロセスを重視\u003C/strong>します。\u003C/p>\u003Cp>代表的なモデルのひとつに「\u003Cstrong>ダブルダイヤモンドモデル\u003C/strong>」があります。\u003Cbr>これは、まずアイデアを広く出して課題を見つけ(発散)、そこから重要な問題に絞り込む(収束)。  \u003Cbr>次に、その問題に対する解決案を再び広げ(発散)、最適な案に絞る(収束)という流れで進めていくものです。\u003C/p>\u003Cp>また、デザイン思考は次のようなプロセスとして整理されることもあります。\u003C/p>\u003Col>\u003Cli>理解：インタビューや観察を通してユーザーを知る  \u003C/li>\u003Cli>定義：どこに問題があるのかを整理する  \u003C/li>\u003Cli>発想：ブレストなどでアイデアを広げる  \u003C/li>\u003Cli>試作：アイデアを形にする  \u003C/li>\u003Cli>テスト：ユーザーの反応を見て検証する  \u003C/li>\u003C/ol>\u003Cp>これらを一度で終わらせるのではなく、\u003Cstrong>繰り返しながら精度を高めていくことが重要\u003C/strong>です。\u003C/p>\u003Ch2 id=\"ha214098e44\">まとめ\u003C/h2>\u003Cp>UX にはさまざまなモデルやフレームワークがあり、どれが正解というよりも、\u003Cstrong>状況に応じて使い分けながら試していくことが大切\u003C/strong>だと感じました。\u003Cbr>\u003Cbr>今回あらためて整理してみて、UX やデザイン思考に共通しているのは、\u003Cstrong>「調査 → 要件定義 → アイデア出し → 試作 → テスト」といったプロセスを、一度で終わらせるのではなく、行き来しながら繰り返していくという姿勢\u003C/strong>だと実感しています。\u003Cbr>とにかく一度つくって終わりではなく、プロセスを回し続けて改善していくこと。その考え方が根底にあるのが UX なのだと思います。\u003Cbr>\u003Cbr>まだ知識として学んでいる段階で、自分の中で体系立てて整理しきれていない部分も多いですが、実務の中で使いながら理解を深めていきたいです。\u003Cbr>\u003Cbr>\u003Cstrong>ちょうど現在、UX 検定の申込受付期間(試験は7月)\u003C/strong>でもあるので、興味がある方はこのタイミングで受けてみるのも良いかもしれません。\u003C/p>",{"id":78,"eyecatch":79,"publishedAt":83,"createdAt":84,"title":85,"is_html":26,"content2":86},"figma-plugin",{"url":80,"height":81,"width":82},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/4eb2c2eb6cf4470b9b0ef247889fd582/figma.jpg",2784,4096,"2026-04-02T01:54:21.369Z","2026-03-31T03:52:33.440Z","Figma の作業を効率化するプラグインを作ってみた","\u003Cp>\u003Cstrong>デザインの現場では、画面の命名やフレームの作成、整列、スタイルの整理といった細かい作業が発生\u003C/strong>します。\u003Cbr>一つひとつは単純ですが、積み重なると時間を奪い、\u003Cstrong>ミスやストレスの原因\u003C/strong>にもなります。\u003C/p>\u003Cp>こうした作業を減らすために、\u003Ca href=\"https://www.s2factory.co.jp/blog/event-ai-agent/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>社内での AI エージェント検証\u003C/strong>\u003C/a>をきっかけに、\u003Ca href=\"https://code.claude.com/docs/ja/overview\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>Claude Code\u003C/strong>\u003C/a>\u003Cstrong> を使って\u003C/strong>\u003Ca href=\"https://www.figma.com/ja-jp/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>Figma\u003C/strong>\u003C/a>\u003Cstrong> 上の作業を効率化するプラグイン\u003C/strong>をいくつか作り始めました。\u003C/p>\u003Cp>というわけでこの記事では、\u003Cstrong>作ったプラグインを紹介\u003C/strong>していきたいと思います。\u003Cbr>\u003Cbr>AI エージェント検証についての記事はこちらです。\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://www.s2factory.co.jp/blog/event-ai-agent/\" data-iframely-url=\"https://cdn.iframe.ly/api/iframe?card=small&amp;url=https%3A%2F%2Fwww.s2factory.co.jp%2Fblog%2Fevent-ai-agent%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"https://cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>\u003Ch2 id=\"hf9f18e5bd9\">Frame Bulk Generator\u003C/h2>\u003Cp>\u003Cstrong>画面一覧をもとに、画面名とサイズをまとめて反映できるプラグイン\u003C/strong>です。\u003C/p>\u003Cp>あらかじめ画面一覧がある場合でも、Figma 上では名前の貼り付けとサイズ設定を一つずつ行う必要があり、手間がかかっていました。数が増えると、コピペミスも起きやすくなります。\u003Cbr>この作業をまとめて済ませられるようになったことで、初期構成の準備を短時間で進められるようになりました。\u003Cbr>\u003C/p>\u003Cp>\u003Cstrong>使い方\u003C/strong>\u003C/p>\u003Col>\u003Cli>\u003Cstrong>スプレッドシートなどから画面一覧をコピー\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>プラグインに貼り付け\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>画面サイズを指定して実行\u003C/strong>\u003C/li>\u003C/ol>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/2bc2442126414af2b324590d29942a1a/Frame%20Bulk%20Generator.png?w=498&amp;h=600\" alt=\"\" width=\"498\" height=\"600\">\u003C/figure>\u003Ch2 id=\"h54553cec90\">Frame Labeler\u003C/h2>\u003Cp>オートレイアウトで整理した画面でも、\u003Cstrong>フレーム名を見える形で管理できるプラグイン\u003C/strong>です。\u003Cbr>\u003Cbr>オートレイアウトで画面をまとめるとフレーム名が表示されなくなり、どの画面なのか分かりづらくなります。せっかく付けた名前も活かせず、確認や共有の手間が増えていました。\u003Cbr>そこで、フレーム名をラベルとして画面上に配置し、\u003Cstrong>ラベルと画面をオートレイアウトでまとめる\u003C/strong>ことで、見た目を崩さずに名前を表示できるようにしました。フレーム名を変更すれば\u003Cstrong>ラベルや構造にも反映される\u003C/strong>ため、個別に修正する必要もありません。\u003C/p>\u003Cp>\u003Cstrong>使い方\u003C/strong>\u003C/p>\u003Col>\u003Cli>\u003Cstrong>ラベルを付与したいフレームを選択(複数可)\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>プラグインを実行\u003C/strong>\u003C/li>\u003C/ol>\u003Cp>\u003Cspan style=\"color: #999999\">※フレーム名を変更した場合は再実行するとラベルにも反映されます\u003C/span>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/1106f8a898dd4dfd9e8aa2e917ab1f00/Frame%20Labeler.png\" alt=\"Frame Labeler\" width=\"2300\" height=\"1388\">\u003C/figure>\u003Ch2 id=\"h30d8b8ca78\">Variable Exporter\u003C/h2>\u003Cp>Variables の情報をもとに、\u003Cstrong>スタイルシートをそのまま書き出せるプラグイン\u003C/strong>です。\u003Cbr>\u003Cbr>Variablesでデザインを管理していても、最終的にはスタイルガイドを別途整える必要があり、同じ内容を作り直す手間が発生していました。\u003Cbr>そこで、Variablesの内容をそのままスタイルとして書き出すことで、\u003Cstrong>デザインと資料を分けずに管理\u003C/strong>できるようにしました。スタイルシート作成にかかる時間も短縮されています。\u003C/p>\u003Cp>\u003Cspan style=\"color: #999999\">※テキストサイズの反映についてはまだ調整中です\u003C/span>\u003C/p>\u003Ch2 id=\"ha214098e44\">まとめ\u003C/h2>\u003Cp>今回紹介したプラグインは、どれも大きな機能ではありませんが、\u003Cstrong>日々の細かい作業を確実に減らしてくれるもの\u003C/strong>です。\u003Cbr>画面の準備や整理、スタイルの書き出しといった工程をまとめて効率化することで、手を動かす時間を減らし、\u003Cstrong>設計や検討に集中できる状態\u003C/strong>をつくっています。\u003C/p>\u003Cp>社内で進めているAIエージェントの検証も含め、こうした取り組みを通して、これまで手作業で行っていた部分を少しずつ置き換えられるようになってきました。結果として、作業負担の軽減だけでなく、ミスの削減にもつながっています。\u003C/p>\u003Cp>今回紹介したもの以外にも、まだ試している段階のものや、これから改善していくものもあります。\u003Cstrong>今後も新しく作ったプラグインや運用の変化があれば、この記事に追記していく予定\u003C/strong>です。\u003C/p>\u003Cp>引き続き、デザイン業務の中で「減らせる作業」を見つけながら、より効率的に進められる方法を探っていきます。\u003C/p>",{"id":88,"eyecatch":89,"publishedAt":93,"createdAt":94,"title":95,"is_html":26,"content2":96},"nazotoki",{"url":90,"height":91,"width":92},"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/1237f7caf6704f568fb90b1c3c65bcd3/s2-nazotoki.png",1201,1944,"2026-03-30T08:35:07.001Z","2026-03-17T06:24:17.497Z","Web サイトを使った謎解きを作ってみた","\u003Cp>毎朝飲んでるトマトジュースがついに40円も値上げしてしまいました…。\u003C/p>\u003Cp style=\"text-align: start\">この記事は、社内イベント「\u003Ca href=\"https://www.s2factory.co.jp/blog/tea/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">\u003Cu>お茶会\u003C/u>\u003C/a>」での発表内容をもとにまとめたものです。\u003Cbr>今回は弊社の \u003Ca href=\"https://x.com/s2_takano\" target=\"_blank\" rel=\"noopener noreferrer\">takano\u003C/a> が、\u003Cstrong>「謎解き」\u003C/strong>をテーマに発表を行いました。\u003C/p>\u003Chr>\u003Cp>\u003Cbr>もともと謎解きが好きで、街歩き型のイベントや脱出ゲームなどにもよく参加しているほか、また最近では、自宅で遊べるキット型の謎解きなどにも手を出しています。\u003C/p>\u003Cp>その流れで、\u003Cstrong>今回自分でも謎解きを作ってみました。\u003C/strong>\u003C/p>\u003Cp>「謎解き」と言われても、あまり馴染みがないとイメージしづらいかもしれません。\u003Cbr>そもそも謎解きとはどういうものなのか。そこから説明したいと思います。\u003C/p>\u003Ch2 id=\"heb6bf4fdb1\">謎解きとは\u003C/h2>\u003Cp>まずはクイズとの違いから見てみます。\u003Cbr>たとえば、こんな問題です。\u003C/p>\u003Cblockquote>\u003Cp>\u003Cstrong>小田原北条氏の三代目は氏康ですが、その三男は北条氏照です。\u003Cbr>では、彼が築いた八王子にある山城といえば？\u003C/strong>\u003C/p>\u003C/blockquote>\u003Cp>答えは「\u003Cspan style=\"color: #ffffff\">八王子城\u003C/span>」。\u003Cbr>\u003Cbr>この問題は、知識がないと解くことができません。\u003Cbr>一方で、謎解きは少し性質が異なります。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/01968bad337e4b32a6ea03bd0288fd8e/%E8%AC%8E%E8%A7%A3%E3%81%8D%E8%BF%B7%E8%B7%AF.png?w=450&amp;h=402\" alt=\"謎解き迷路\" width=\"450\" height=\"402\">\u003C/figure>\u003Cp>\u003Cbr>この問題を解くと、\u003Cspan style=\"color: #000000\">「\u003C/span>\u003Cspan style=\"color: #ffffff\">ウジテル\u003C/span>\u003Cspan style=\"color: #000000\">」\u003C/span>という答えが出てきます。\u003Cbr>\u003Cbr>\u003Cstrong>クイズが知識を前提にしているのに対して、謎解きは問題の中にある法則やヒントに気づく(閃く)ことで、答えにたどり着きます。\u003C/strong>北条氏照という人物を知らなくても解ける。これが、クイズと謎解きの大きな違いです。\u003C/p>\u003Cp>考えても分からない時間があって、\u003Cstrong>ふと気づく瞬間\u003C/strong>がある。\u003Cstrong>その体験が、謎解きの面白さ\u003C/strong>につながっています。\u003C/p>\u003Ch3 id=\"hd0bb2aed17\">謎解きの広がり\u003C/h3>\u003Cp>謎解きの起源については諸説ありますが、主な流れを整理すると以下の通りです。\u003C/p>\u003Cul>\u003Cli>\u003Cstrong>1997年頃：\u003C/strong>\u003Ca href=\"https://www.scrapmagazine.com/column/wakuwaku01/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>株式会社SCRAP代表が親戚の集まりで宝探しイベントを始める\u003C/strong>\u003C/a>\u003C/li>\u003Cli>\u003Cstrong>2001年：リアル宝探しの開始(タカラッシュ)\u003C/strong>\u003Cul>\u003Cli>現実空間で楽しむ謎解きが登場。\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>2004年：『\u003C/strong>\u003Ca href=\"https://ja.wikipedia.org/wiki/%E8%84%B3%E5%86%85%E3%82%A8%E3%82%B9%E3%83%86_IQ%E3%82%B5%E3%83%97%E3%83%AA\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>脳内エステ IQサプリ\u003C/strong>\u003C/a>\u003Cstrong>』放送開始\u003C/strong>\u003Cul>\u003Cli>テレビ放送としての謎解きの原点ともいえる存在です。\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>2004年：『\u003C/strong>\u003Ca href=\"https://y.honkakuha.success-games.net/game/su-56-crimsonroom/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>クリムゾン・ルーム\u003C/strong>\u003C/a>\u003Cstrong>』公開\u003C/strong>\u003Cul>\u003Cli>Flashゲームとして話題になり、脱出ゲームの原点のひとつとされています。\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>2007年：リアル脱出ゲーム初開催(SCRAP)\u003C/strong>\u003Cul>\u003Cli>体験型イベントとして一気に広がります。\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>2012年：\u003C/strong>\u003Ca href=\"https://www.newsweekjapan.jp/stories/business/2015/06/post-3675_3.php\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>海外展開\u003C/strong>\u003C/a>\u003Cstrong>(サンフランシスコなど)\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>2017年：\u003C/strong>\u003Ca href=\"https://corp.eplus.jp/press-release/detail/20171102.html\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>東京ミステリーサーカス オープン\u003C/strong>\u003C/a>\u003Cul>\u003Cli>新宿歌舞伎町に脱出ゲームや謎解きが楽しめる常設施設が誕生。\u003C/li>\u003C/ul>\u003C/li>\u003Cli>\u003Cstrong>2019年：来場者100万人突破(東京ミステリーサーカス)\u003C/strong>\u003C/li>\u003Cli>\u003Cstrong>2019年：\u003C/strong>\u003Ca href=\"https://riddler.co.jp/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>RIDDLER株式会社\u003C/strong>\u003C/a>\u003Cstrong>設立\u003C/strong>\u003Cul>\u003Cli>謎解きを軸に、さまざまなメディアで体験を企画・制作するクリエイター集団。\u003C/li>\u003C/ul>\u003C/li>\u003C/ul>\u003Cp>このように、謎解きは年々盛り上がりを見せており、現在では大きな\u003Cstrong>ブーム\u003C/strong>となっています。\u003C/p>\u003Cp>たとえば、株式会社SCRAPが手がけるリアル脱出ゲームは累計参加者1,500万人を突破し、大規模な体験型イベントとして定着しました。\u003Cbr>また、「\u003Ca href=\"https://realdgame.jp/s/chikanazo2025/?link=enjoy\" target=\"_blank\" rel=\"noopener noreferrer\">地下謎への招待状\u003C/a>」のように、\u003Cstrong>鉄道や街全体を使った、日常の移動や街歩きそのものがゲームとなる企画も登場\u003C/strong>し、多くの参加者を集めています。\u003C/p>\u003Cp>それだけでなく、\u003Cstrong>企業向けのチームビルディング研修\u003C/strong>などにも取り入れられ、エンタメにとどまらない形でも活用されています。\u003C/p>\u003Ch2 id=\"h88ea32f50f\">実際に謎解きを作ってみた\u003C/h2>\u003Cp>謎解きにハマってからというもの、脱出ゲームや街歩き型の謎解き、キットを購入して遊ぶタイプのものなど、\u003Cstrong>いろいろと遊んできました\u003C/strong>。そのうちに自分でも作ってみたくなり、実際に作ってみました。\u003Cbr>\u003Cbr>実は最近、トップページをリニューアルしたこともあり、せっかくならその内容も見てもらえるような形にできないかと思い、\u003Cstrong>Web サイトを見ながら進める謎解き\u003C/strong>を作ってみることにしました。\u003C/p>\u003Ch3 id=\"h339271c395\">ストーリーとキーワードの設定\u003C/h3>\u003Cp>ストーリーについては、\u003Cstrong>「こういうことをやりたい」という方向性\u003C/strong>を決めて、\u003Ca href=\"https://gemini.google.com/app?hl=ja\" target=\"_blank\" rel=\"noopener noreferrer\">Gemini\u003C/a> に投げて考えてもらいました。\u003C/p>\u003Cp>あわせて、伝えたいキーワードも先に決め、それを最終的な答えとして設計しています。\u003Cbr>\u003Cstrong>どのように解くとその答えにたどり着くのか\u003C/strong>という流れも、この段階で考えました。\u003C/p>\u003Cp>今回の謎解きページは、\u003Cstrong>Web サイトのログイン画面をイメージ\u003C/strong>しています。\u003Cbr>各問題を解きながら情報を集め、最終的に導き出した答えをログイン用の\u003Cstrong>パスワード\u003C/strong>として入力することでクリア！という構成にしています。\u003Cbr>\u003Cbr>\u003C/p>\u003Cfigure>\u003Cimg src=\"https://images.microcms-assets.io/assets/0eb919b93c74437dbd287ab903d9ea2c/1237f7caf6704f568fb90b1c3c65bcd3/s2-nazotoki.png\" alt=\"\" width=\"1944\" height=\"1201\">\u003C/figure>\u003Ch3 id=\"ha572ddd150\">謎の設計\u003C/h3>\u003Cp>最終的な答えの文字数などから、\u003Cstrong>全体の STEP 数\u003C/strong>を決めています。\u003C/p>\u003Cp>Webサイトを見てもらうことが目的だったため、\u003Cstrong>サイトを見ながら答えにたどり着くような問題\u003C/strong>を中心にしたいと考えていました。ただ、実際に作ってみると難しく、途中でその方針を維持するのが難しくなり、\u003Cstrong>完全にはやりきれず…\u003C/strong>。\u003C/p>\u003Cp>ちなみにの話ですが、謎を作るうえで便利だったのが「\u003Ca href=\"https://shiwehi.com/tools/wordsearch/\" target=\"_blank\" rel=\"noopener noreferrer\">謎解き単語検索β\u003C/a>」です。\u003Cbr>答えに「ネコ」を使いたいがそのまま見せたくない場合に、「?ねこ?」のように指定すると、前後に文字を加えた単語を辞書から探してくれます。\u003C/p>\u003Ch3 id=\"h922edff87b\">実装\u003C/h3>\u003Cp>\u003Cstrong>謎解きに使った画像は Google Slide で作成し、それをWebページに落とし込む作業は \u003C/strong>\u003Ca href=\"https://antigravity.google/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>Antigravity\u003C/strong>\u003C/a> で行いました。\u003C/p>\u003Cp>実装では、\u003Cstrong>ネタバレ防止\u003C/strong>の工夫に特に気を使っています。\u003Cbr>ソースコードから答えが分かってしまわないように \u003Cstrong>Hash\u003C/strong> を使うように指示したり、次のメッセージが先に見えてしまわないよう、\u003Cstrong>動的に JavaScript ファイルを読み込む仕組み\u003C/strong>にしています。\u003C/p>\u003Cp>また、スクロールスピードや文字をタイプしているような演出についても細かく指示を出し、\u003Cstrong>体験として違和感が出ないように調整\u003C/strong>しています。\u003C/p>\u003Ch3 id=\"h98ba4996ba\">デバッグ\u003C/h3>\u003Cp>まず、\u003Cstrong>脱出ゲームに慣れているスタッフにデバッグを依頼\u003C/strong>しました。\u003Cbr>その中で、間違いや別解の発生、分かりづらい箇所などの指摘を受け、内容や画像を修正しています。\u003C/p>\u003Cp>その後、別のスタッフにも解いてもらい、さらに\u003Cstrong>ブラッシュアップ\u003C/strong>を行いました。\u003Cbr>人によって詰まるポイントが異なる部分もあったため、\u003Cstrong>最終的には少し難易度を下げる方向で調整\u003C/strong>しています。\u003C/p>\u003Ch3 id=\"h785b0e1177\">公開\u003C/h3>\u003Cp>\u003Cstrong>最終的にAnalyticsの設定やインフラの準備も行い、公開\u003C/strong>しました。\u003C/p>\u003Ch2 id=\"h1331c56b22\">作ってみた感想\u003C/h2>\u003Cp>本来の仕事であるコーディングと近い部分もあり、普段とは違う形で頭を使うのが新鮮で楽しかったです。\u003C/p>\u003Cp>遊んでいる人の様子をリアルタイムで見られたら、どこで悩んでいるのか、どう進めているのかなども分かって面白かったのではないかと思います。\u003Cbr>今回はそこまで設計できていませんでしたが、\u003Cstrong>Analytics の取り方\u003C/strong>を工夫すれば、どこで詰まっているのかといった\u003Cstrong>ユーザーの動きも可視化\u003C/strong>できそうだと感じました。\u003C/p>\u003Cp>一方で、途中で力尽きてしまった部分もあり、当初考えていた\u003Cstrong>「Webサイトを見てもらいながら解いてもらう構成」を最後までやりきれなかった点は少し心残り\u003C/strong>です。\u003C/p>\u003Cp>実際に作ってみて、これを仕事としてやっているプロの謎解きクリエイターのすごさを改めて実感しました。\u003Cbr>\u003Cbr>もしよければ、\u003Ca href=\"https://lab.s2factory.co.jp/nazo2026s/\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Cstrong>実際に遊んでみてもらえると\u003C/strong>\u003C/a>幸いです。\u003C/p>\u003Cdiv class=\"iframely-embed\">\u003Cdiv class=\"iframely-responsive\" style=\"height: 140px; padding-bottom: 0;\">\u003Ca href=\"https://lab.s2factory.co.jp/nazo2026s/\" data-iframely-url=\"https://cdn.iframe.ly/api/iframe?url=https%3A%2F%2Flab.s2factory.co.jp%2Fnazo2026s%2F&amp;key=c271a3ec77ff4aa44d5948170dd74161\">\u003C/a>\u003C/div>\u003C/div>\u003Cscript async src=\"https://cdn.iframe.ly/embed.js\" charset=\"utf-8\">\u003C/script>",167,{"contents":99,"totalCount":321,"offset":63,"limit":322},[100,103,106,109,112,115,118,121,124,127,130,133,136,139,142,145,148,151,154,155,158,161,164,167,170,173,176,179,182,183,186,189,192,194,197,200,203,206,209,212,215,218,221,222,225,228,231,234,237,240,243,246,249,252,255,258,261,264,267,270,273,276,279,282,285,288,291,294,297,300,303,306,309,312,315,318],{"id":101,"name":102},"ai","AI",{"id":104,"name":105},"workshop","ワークショップ",{"id":107,"name":108},"tool","ツール",{"id":110,"name":111},"office","オフィス",{"id":113,"name":114},"internal-project","社内案件",{"id":116,"name":117},"event","イベント",{"id":119,"name":120},"iot","IoT",{"id":122,"name":123},"art","アート",{"id":125,"name":126},"moving","引越し",{"id":128,"name":129},"picture","映像",{"id":131,"name":132},"plant","植物",{"id":134,"name":135},"company-trip","社員旅行",{"id":137,"name":138},"health","健康",{"id":140,"name":141},"exercise","運動",{"id":143,"name":144},"bicycle-club","自転車部",{"id":146,"name":147},"promotion","PR",{"id":149,"name":150},"interview","Interview",{"id":152,"name":153},"recruiting","採用",{"id":15,"name":19},{"id":156,"name":157},"history","歴史",{"id":159,"name":160},"life","生活",{"id":162,"name":163},"club","部活動",{"id":165,"name":166},"character","キャラクター",{"id":168,"name":169},"food","食",{"id":171,"name":172},"math","数学",{"id":174,"name":175},"alcohol","酒",{"id":177,"name":178},"infrastructure","インフラ",{"id":180,"name":181},"application","アプリ",{"id":22,"name":25},{"id":184,"name":185},"data","通信",{"id":187,"name":188},"migration","地方移住",{"id":190,"name":191},"security","セキュリティ",{"id":193,"name":193},"esports",{"id":195,"name":196},"look-back","振り返り",{"id":198,"name":199},"animal","動物",{"id":201,"name":202},"css","CSS",{"id":204,"name":205},"game","ゲーム",{"id":207,"name":208},"typescript","TypeScript",{"id":210,"name":211},"management","マネジメント",{"id":213,"name":214},"remote-work","リモートワーク",{"id":216,"name":217},"frame-work","フレームワーク",{"id":219,"name":220},"music","音楽",{"id":28,"name":31},{"id":223,"name":224},"covid-19","コロナ",{"id":226,"name":227},"railway","鉄道",{"id":229,"name":230},"agriculture","農業",{"id":232,"name":233},"hobby","趣味",{"id":235,"name":236},"certification","資格",{"id":238,"name":239},"personal-computer","PC",{"id":241,"name":242},"welfare","福利厚生",{"id":244,"name":245},"tech","技術",{"id":247,"name":248},"study","勉強",{"id":250,"name":251},"mental-health","メンタルヘルス",{"id":253,"name":254},"frontend","フロントエンド",{"id":256,"name":257},"pilates","ピラティス",{"id":259,"name":260},"backend","バックエンド",{"id":262,"name":263},"tunnel","トンネル",{"id":265,"name":266},"design","デザイン",{"id":268,"name":269},"sports","スポーツ",{"id":271,"name":272},"online","オンライン",{"id":274,"name":275},"internship","インターンシップ",{"id":277,"name":278},"animation","アニメーション",{"id":280,"name":281},"virtual-reality","VR",{"id":283,"name":284},"ssl","SSL",{"id":286,"name":287},"perl","Perl",{"id":289,"name":290},"operating-system","OS",{"id":292,"name":293},"ios","iOS",{"id":295,"name":296},"google","Google",{"id":298,"name":299},"deeplearning","DeepLearning",{"id":301,"name":302},"aws","AWS",{"id":304,"name":305},"apple","Apple",{"id":307,"name":308},"api","API",{"id":310,"name":311},"3-d","3D",{"id":313,"name":314},"school","学校",{"id":316,"name":317},"blender","Blender",{"id":319,"name":320},"android","Android",76,200,{"contents":324,"totalCount":64,"offset":63,"limit":64},[325,379,444],{"id":326,"createdAt":327,"updatedAt":328,"publishedAt":329,"revisedAt":328,"title":330,"category":331,"thumbnail":340,"image":344,"content":353,"keyword":354,"client":369,"team":370,"url":374,"release":375,"status":376,"top":26,"blog":20,"service":378},"phpj-noel-2025","2025-12-15T06:18:04.117Z","2026-03-10T03:11:10.799Z","2026-03-05T04:15:03.177Z","PIERRE HERMÉ PARIS | NOËL 2025",[332,337],{"id":333,"createdAt":334,"updatedAt":335,"publishedAt":334,"revisedAt":334,"name":336},"web","2024-03-22T05:33:05.262Z","2024-06-24T23:16:42.692Z","ウェブ制作",{"id":265,"createdAt":338,"updatedAt":338,"publishedAt":338,"revisedAt":338,"name":339},"2024-03-22T05:34:30.127Z","デザイン＆ディレクション",{"url":341,"height":342,"width":343},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/47e7b069013a45b8b6e931ec132bd272/thumb.png",900,1200,[345,349,351],{"url":346,"height":347,"width":348},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/43a703ebe8d7467aac2c995378cb081e/1.png",1800,2400,{"url":350,"height":347,"width":348},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/6aed2d670822422696329a5cb3a6877f/2.png",{"url":352,"height":347,"width":348},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/b691d73151a94dcf9d60a6f8af436eac/3.png","\u003Cp>昨年に続き、ホリデーシーズン限定の『NOËL 2025』スペシャルサイトを、デザインとフロントエンドで担当しました。\u003Cbr>\u003Cbr>「深海(アビス)」をテーマに、鮮やかな青から徐々に暗く沈んでいくグラデーションで、海の中を潜っていくような体験を表現。泡や珊瑚、砂などのモチーフを取り入れ、ページ全体で海中の世界を感じられる構成に仕上げました。\u003Cbr>\u003Cbr>砂や泡の表現にはWebGLとGPGPUを用い、数万単位のパーティクルをGPUで並列処理することで滑らかな動作を実現。一部テキストは3D描画で演出しながら、DOM上にも同内容を配置し、表現とSEOの両立を図りました。\u003Cbr>また、Safariなどブラウザ差異による負荷を考慮し、SVGからCanvasへ置き換えるなど最適化を実施。視覚的な印象を保ちながら、各環境で安定して動作するよう設計しています。\u003Cbr>\u003Cbr>デザインと実装の両面から、制作の背景やポイントについてブログで詳しく解説しています。\u003C/p>",[355,359,364],{"id":356,"createdAt":357,"updatedAt":358,"publishedAt":357,"revisedAt":358,"name":254,"filter":20,"page":20},"ice0h9h9ap","2024-06-28T01:14:44.830Z","2025-01-15T07:40:01.729Z",{"id":360,"createdAt":361,"updatedAt":362,"publishedAt":361,"revisedAt":362,"name":363,"filter":20,"page":20},"6ncqc37v7nzq","2024-06-28T01:14:12.293Z","2025-01-15T07:39:08.437Z","デザインプロジェクト",{"id":365,"createdAt":366,"updatedAt":367,"publishedAt":366,"revisedAt":367,"name":368,"filter":20,"page":20},"ztrz9np70v","2024-06-28T01:14:41.050Z","2025-01-15T07:40:30.428Z","コンセプトメイキング"," PH PARIS JAPON 株式会社",[371],{"fieldId":372,"title":373},"teamField","S2ファクトリー","https://www.s2factory.co.jp/blog/noel2025/","2025.10.17",[377],"公開中",[],{"id":380,"createdAt":381,"updatedAt":382,"publishedAt":381,"revisedAt":382,"title":383,"category":384,"thumbnail":391,"image":395,"content":400,"keyword":401,"client":383,"team":416,"url":439,"release":440,"status":441,"statusText":442,"top":20,"blog":20,"service":443},"tamabi","2024-06-28T01:58:38.788Z","2025-05-27T03:25:42.261Z","多摩美術大学",[385,386],{"id":333,"createdAt":334,"updatedAt":335,"publishedAt":334,"revisedAt":334,"name":336},{"id":387,"createdAt":388,"updatedAt":389,"publishedAt":388,"revisedAt":388,"name":390},"system","2024-03-22T05:33:52.708Z","2024-06-24T23:16:53.739Z","システム開発",{"url":392,"height":393,"width":394},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/dea8e004e627415c80bf7b8d622bb4b9/tamabi-thumbnail-1.png",456,600,[396],{"url":397,"height":398,"width":399},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/a000f3cedf5d474d83c5b70e8c11db4e/tamabi-other-1.png",1305,1740,"\u003Cp>「多摩美術大学」ウェブサイトリニューアルのお手伝いをさせていただきました。\u003Cbr>\u003Cbr>サイトのコンテンツを大幅に整理し、運用効率を考慮した再利用しやすく組み合わせやすいUIコンポーネントを構築。また多くの方に利用していただけるようにアクセシビリティの向上にも注力しました。\u003Cbr>インフラは、従来のオンプレミスとクラウドが混在していた環境から、AWS への段階的な移行を進めており、今後の完全移行に向けた準備も進行中です。 \u003Cbr>\u003Cbr>弊社は、フロントエンドとバックエンドの実装、インフラ構築を担当しました。\u003C/p>",[402,406,410,415],{"id":403,"createdAt":404,"updatedAt":405,"publishedAt":404,"revisedAt":405,"name":302,"filter":20,"page":20},"uftrxsmd0v72","2024-06-28T01:14:13.671Z","2025-01-15T07:39:25.538Z",{"id":407,"createdAt":408,"updatedAt":408,"publishedAt":408,"revisedAt":408,"name":409,"filter":26,"page":26},"yctx9hzd4","2024-06-28T01:14:33.743Z","Lambda",{"id":411,"createdAt":412,"updatedAt":413,"publishedAt":412,"revisedAt":413,"name":414,"filter":20,"page":20},"u84cy0fbzno","2024-06-28T01:14:39.521Z","2025-01-15T07:40:41.433Z","Cloud",{"id":356,"createdAt":357,"updatedAt":358,"publishedAt":357,"revisedAt":358,"name":254,"filter":20,"page":20},[417,420,423,426,429,432,435,438],{"fieldId":372,"title":418,"link":419},"萩原 俊矢","https://shunyahagiwara.com/#/works",{"fieldId":372,"title":421,"link":422},"GrandBase Inc.","https://www.grandbase.jp/",{"fieldId":372,"title":424,"link":425},"DSCL Inc.","https://dscl.jp/",{"fieldId":372,"title":427,"link":428},"株式会社トラフィックス","https://traffics.jp/",{"fieldId":372,"title":430,"link":431},"株式会社カンバセーションズ","https://qonversations.jp/",{"fieldId":372,"title":433,"link":434},"Measurements Inc.","https://www.measurements.co.jp/",{"fieldId":372,"title":436,"link":437},"tha ltd.","https://tha.jp/",{"fieldId":372,"title":373},"https://www.tamabi.ac.jp/","2024.4.4",[377],null,[336],{"id":445,"createdAt":446,"updatedAt":447,"publishedAt":446,"revisedAt":447,"title":448,"category":449,"thumbnail":451,"image":453,"content":462,"keyword":463,"client":436,"team":479,"url":485,"release":486,"status":487,"statusText":442,"top":26,"blog":20,"service":488},"humanity","2024-06-28T01:56:51.507Z","2025-05-27T03:26:34.287Z","HUMANITY",[450],{"id":387,"createdAt":388,"updatedAt":389,"publishedAt":388,"revisedAt":388,"name":390},{"url":452,"height":393,"width":394},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/740adb4e02c54fee97d12025df5f16a0/humanity-thumbnail-1.png",[454,456,458,460],{"url":455,"height":398,"width":399},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/2a10b034854d40e789d38ac33e0a3c4e/humanity-other-1.png",{"url":457,"height":398,"width":399},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/1091c52a97f745e5a3fc105bd0e542dc/humanity-other-2.png",{"url":459,"height":398,"width":399},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/613c8c836fff40119e9f85097262399d/humanity-other-3.png",{"url":461,"height":398,"width":399},"https://images.microcms-assets.io/assets/d6dcb8ec530642e7a9b0d0c0a93bf874/3a9dfb8cce0d4ec887ead3d3998be04c/humanity-other-4.png","\u003Cp>『HUMANITY』は、インターフェース／ビジュアルデザイナーの中村勇吾氏とゲームクリエイター水口哲也氏のタッグによって制作された PlayStation 5(PS VR2対応)、PlayStation 4(PS VR対応)、Steam(PC用VR対応)用アクションパズルゲームです。\u003Cbr>\u003Cbr>プレイヤーは柴犬を操作して、自我を失った人類を導きゴールを目指します。\u003Cbr>メインのストーリーモードには 90 以上のステージを収録。さらに「STAGE CREATOR」では、自分だけのオリジナルステージを作って全世界のプレイヤーにシェアが可能です。また「USER STAGES」では、他のプレイヤーがシェアしたステージが公開され、カスタムのプレイリストや、タグを使用して検索し、お気に入りのステージを発見・チャレンジできます。\u003Cbr>\u003Cbr>弊社はゲームのコミュニティ機能のバックエンドと管理ツールの作成、インフラを担当しました。\u003C/p>",[464,469,474,475],{"id":465,"createdAt":466,"updatedAt":467,"publishedAt":466,"revisedAt":467,"name":468,"filter":20,"page":20},"fg8e4c9nl","2024-06-28T01:14:04.517Z","2025-01-15T07:36:58.970Z","CMS",{"id":470,"createdAt":471,"updatedAt":472,"publishedAt":471,"revisedAt":472,"name":473,"filter":20,"page":20},"p6qgoo2k9vl9","2024-06-28T01:14:06.759Z","2025-01-15T07:37:22.466Z","大規模データ",{"id":411,"createdAt":412,"updatedAt":413,"publishedAt":412,"revisedAt":413,"name":414,"filter":20,"page":20},{"id":476,"createdAt":477,"updatedAt":478,"publishedAt":477,"revisedAt":478,"name":205,"filter":20,"page":20},"pxnv6cy2u","2024-06-28T01:14:45.570Z","2025-01-15T07:39:54.004Z",[480,483,484],{"fieldId":372,"title":481,"link":482},"Enhance","https://enhance-experience.com/ja/",{"fieldId":372,"title":436,"link":437},{"fieldId":372,"title":373},"https://humanity.game/ja/","2023.5.16",[377],[390],1777539717792]