筆者は、個人開発プロジェクト「ディスカッションサイト Ideoj (イデオ)」の企画・開発を主に行っており、昨年10月頃に発起してから開発を続けている。この度ほぼ全てのページ（機能）について、情報構造とその見せ方を考慮した再デザインを実施した。(5月頃のお話)

なお、現在このプロジェクトはLetero - 長文コミュニケーションサイトに移行しており、デザインもさらなる修正が加えられた。

この記事の後に行った修正↓ agelog.hateblo.jp

これらのデザインは修正途中のものであり、より洗練された形に今後も変化を続けていくことになる。

サービスの世界観を伝えるデザインのベース
- テイストの決定
- カラーの決定
各機能

サービスの世界観を伝えるデザインのベース

テイストの決定

テイストは「英字新聞風」とした。今ネット上のコンテンツは、文章メインの物であっても、キャッチアップ画像をデカデカと置いたり、フリー素材の画像を置いたりしている。しかし、文字ベースのコンテンツであれば、安易に画像に頼るのではなく、フォントやスタイルを巧みに使い分けることで、見易くキャッチーなコンテンツ構成にできると考えた。そして、同じようなコンテンツを探したときに活版印刷時代の英字新聞があり、それを参考にした。

カラーの決定

「落ち着いた議論」「質の高いコンテンツ」が集まる場所を目指すため、Teal組織のtealから連想し、Teal Blueをアクセントカラーに採用することにした。

en.wikipedia.org

この記事のIn Cultureにteal組織のことが書いてある。

また、ベースカラーには、パソコンやスマホで文字を読む際に、目に優しくなるよう、白ではなく生成り色と言う日本の伝統色を採用した。生成色は、染色していない木綿の色ということで、特定の思想や方向性に染まらない、開かれた場所にしたい、という想いとも合致する。

kotobank.jp

各機能

これから出てくるデザインの説明には、Ideojのサイト内の機能の名前が多く登場するため、予め紹介しておく。

レター 一つの投稿単位で、時事問題・政治・社会・哲学などに対する議論や問題提起、考えを自由に投稿できる。

ディスカッション レターに対するディスカッションを投稿することができる。Ideojでは、ディスカッションもレターと同じ比重に扱うことで、ディスカッションそれ自体を重要視し活性化させたい意図を示している。

イベントトピック 定期的に配信される「トピック」は、レターを書くためのお題の様なもので、これについてレターに自分の考え・思考・意見を書くことができる。

ポートフォリオ Ideojでの議論を通して深まった考えを、ポートフォリオにまとめられる。イデオでは、発言者の立場が見えることが、ディスカッションを読み解く上で重要だと考えている。また、レターやディスカッションの投稿者が、どんなバックグランドでその考えを持っているのか、ポートフォリオを見ることである程度理解できるのが理想。

ポートフォリオ機能

まず、ユーザーのプロフィールページである。

修正前

ユーザーが自由な大きさのカードに、「記事一覧」「自由テキスト」「自分の投稿の中から選択したもの」などを表示できる、というものだった。 f:id:krgpi:20200524120531p:plain

修正後

非常に斬新な機能ではあったが、初めてログインしたユーザーが何をここに書いたら良いのか示すものがない、スマホ表示とPC表示の行き来でライブラリ依存の問題が発生する、などの理由で、自由にカードを配置できる形式をやめ、ある程度こちら側でフォーマットを設けることとした。つまり、ユーザー側にアフォーダンスを与えることで、プロフィールをより入力しやすいように導くということである。 f:id:krgpi:20200524120543p:plain