Frontend/Design | どんな言葉も綺麗に見せるウェブサイト（β版）

日頃言えないような愚痴なり黒々とした思いなりを吐き出しても綺麗に見えるようなサイトを作るプロジェクトのβ版です。

入力した言葉を英訳をかけていい感じのアニメーションつけて飛ばす、というシンプルなことをしています。

Creative Concept

なぜこのサイトを作成したのか、ということに関してはnoteに詳細をまとめました。

要約すると、「ネガティブを否定しない作品を作りたい」という思いが私の中にあり、その一つの形として生まれたのが今回のサイトでした。

デザインの方向性としては

・言葉にフォーカスした見せ方にしたい

    →アニメーションページ以外は余計な装飾のないシンプルなデザインに

・どんな言葉も綺麗に変換してくれるイメージがパッと見て伝わるようにしたい

    →ロゴをそのイメージが伝わるような作りにして、キービジュアルとして据える

の二つを主軸にデザインしました。

■アイディアラフ

今回ロゴが一番サイトデザインの中で重要な位置を占めていたので、何パターンかロゴを考え一番適切なものを選んでいきました。

ポイントとしては「変換前と変換後のイメージが湧くもの」がどのような形かを考えました。

Movie

Detail

■制作期間

2週間（企画、デザイン、コーディング）

■制作ツール

[デザイン]

Webデザイン：XD

ロゴ制作：Illustratar

■開発環境・使用ライブラリ

webpac, pug, scss, jquery, TweenMax

Special Thanks

つくっていいともに参加して意見を下さった皆様