紹介する作品は実際に公開しています。覗いて頂けると嬉しいです(｀･ω･´ﾒ)
「Base」紹介HP → https://ss719917.stars.ne.jp/HP/index.html
「Base」試用版 → https://ss719917.stars.ne.jp/
探究活動で開発したWebアプリ「Base」を題材に，設計や開発時の工夫を全5回で紹介します。
はじめに
これまで全4回(6本)に渡って，Baseの内装を中心に解説してきました。
最終回となる今回は，プログラムではなく，「Base」という名前に込めた意味や，UIデザインで意識したことについて紹介します。
命名の由来について
Base（読みはベース）という名称は「学校の基礎を支える」という役割を表しています．
既存のサービスでは，有名なものとしてネットショップ作成サービスBASE（読みはベイス）や，大阪府の英語教育推進事業の一環として開発されたBASE in OSAKAがありますが，いずれも綴りや読みに違いがありました．
商標としては全て大文字の「BASE」が株式会社BASEによって登録（6334861番）されています，不動産・建築・財務相談などが主な事業な企業であるためアプリ名としての使用に問題はないと考えています．
UIデザインで意識したこと
色は下記の理由から，黒(#000000)とウルトラマリン(#434da2)に限定しました。
- 全体に一体感が生まれる
- 黒を基調とすることで文字とのコントラストが上がり可読性が高まる
- 青には集中力を向上させる効果があり，学習を行う機能を含んだ「Base」に適する
デザインでは，「迷わず使えること」を最優先にしました。
端末や環境の違いでレイアウトが崩れてしまうことがないように，要素はすべて生成する際に関数SetStyleに自身と座標，大きさを引数として持たせてabsoluteとして設定しています。
また，意味ごとにデザインを付加することで種類を絞り統一感を持たせました。
おわりに
全5回にわたり，「Base」の実装や設計について紹介してきました。
この記事が，Webアプリを開発している方や，探究活動・個人開発に取り組む方の参考になれば嬉しいです。最後までご覧いただき，ありがとうございました。
「Base」紹介HP(再掲) → https://ss719917.stars.ne.jp/HP/index.html
「Base」試用版(再掲) → https://ss719917.stars.ne.jp/
前回 → ④(後編)：Chart.jsを使わずに成績グラフを実装する - divで棒グラフを作る
今回 → ⑤：命名の由来とUIデザインについて