[Inside Everysite #3] 自由と複雑さのせめぎ合い - アールスリーインスティテュート

公開日：2025-02-21

こんにちは、金春です。

Inside Everysiteも今回で3回目となりました。今回からは、gusuku Everysiteの機能や特徴について少しずつご紹介していきたいと思います。

ただし、2025年2月21日現在、本プロダクトは開発中のため、この記事でご紹介する内容は現時点の情報です。リリース版では変更される可能性がありますので、あらかじめご了承ください。

自由さと複雑さはトレードオフ

gusuku Everysiteが目指す「社外DXのプラットフォーム」として重要なのは、ユーザーにとっての自由度です。

ページのレイアウト
ページ内のデータ表現力
ページの挙動
kintoneなどのデータストアとの連携
情報の閲覧権限の制御

これらは、ユーザーの皆さまのご要望にできる限り応えられるよう、自由に設定できることを目指しています。

しかし、自由度を高めると設定が複雑になりがちです。例えば、gusuku Customineは高い自由度を誇る一方で、「設定が難しい」と感じるユーザーもいらっしゃいます。

このバランスを取ることが非常に難しいと感じています。自由にすると複雑になる。複雑さを抑えると、できることが制限される――このせめぎ合いが課題です。

ツリー構造の理解を不要に

Webページとツリー構造の関係

Webページは一般的にHTMLで記述されます。HTMLはデータ構造として深いツリー構造を持ちます。

例えば、以下は弊社ホームページのトップページの一部を抜粋したHTMLコードです。< >で囲まれたタグが親子関係を形成しているのがご覧いただけるかと思います。

<body class="home page-template-default page page-id-839 wp-custom-logo fa_v6_css vk-blocks no-sidebar">
  <div id="page" class="site">
    <header class="site-header">
      <div class="r3-header">
        <div class="r3-header-inner">
          <div class="r3-header-logo">
            <a href="https://www.r3it.com/" class="custom-logo-link" rel="home" aria-current="page">
              <img width="95" height="42" src="https://www.r3it.com/wp-content/uploads/2023/07/R3logo.svg" class="custom-logo" alt="アールスリーインスティテュート ｜R3 Institute" decoding="async" />
            </a>
          </div>
          <div id="site-navigation" class="main-navigation">
            <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false">
              <span></span>
              <span></span>
              <span></span>
            </button>
          </div>
        </div>
      </div>
    </header>
 </div>
.......

多くのGUIベースのWebページ作成ツールでは、要素をドラッグ＆ドロップで配置するものが多いですが、その多くはHTMLのツリー構造をある程度理解していることを前提としているように感じます。ツリー構造を完全に理解していなくても、行の中に要素を並べるといった親子関係を意識する必要があります。

kintoneのようにフォームを作成するだけであれば、ユーザーがツリー構造を意識する必要はありません。しかし、Webページそのものを作成する場合はそうはいきません。