Stranding Works Website

Identity

Identity

Website

2026/08

Stranding Works Website
  • Client
  • Business Type
  • Product
  • Stranding Works
  • デザインスタジオ
  • Website

縄を編む。心を繋ぐ。

Background

個人事業として3年間、「Cohere.img(コヒア・イメージ)」として活動してきました。 活動する中で、カナダのAI企業と名称が重なることが、引っかかるようになりました。 適格請求書発行事業者の登録を機に、屋号を変更することにしました。 そうして考えたのが「Stranding Works」です。 この屋号は私個人の生き方のゴールに由来します。 「生きている人を増やす」 生きている人とは自分の人生を、意思と責任を持ち、自分で歩む人のことを指します。 未来から過去に向かって流れる時間を縦糸とし、自分の考えや行為を横糸とみた場合、人生は大きな布に例えることができます。 仕事とは人生の一部です。その人生の布から糸を数本取り、ねじり編んだものは縄になります。 一般的にStrandingとは「座礁している状態」や「取り残される」といったネガティブな意味を指す場合が多いですが、私の場合は「縄を編んでいる最中」という意味として使用しています。 他者や物事につながるための象徴としての「縄」という道具をつくることが私の仕事だと思っています。 この屋号で目指すのは、単なる消費を、共感の上での応援に変えること。 それを道具や技術を用いて達成することを目標としています。 屋号が変わればロゴマークもwebサイトも変更する必要があります。 ロゴマークを作成した後に、それを発展させたものとしてwebサイトを作成しました。

Translate

Strandingとは一般的には「座礁」や「取り残される」と言ったネガティブな印象を先に連想されてしまいます。 そうではなく「縄を編んでいる」という意味であることを示すために、 「縄」や「つながり」といったものを全面に出す必要性を考えました。 そしてもう一つ、 「単なる消費ではなく、共感の上での応援に変えたい。」 これは私が事業を行う上で大切にしている考え方です。 数字の追求より強い思いで動く人を応援したいという気持ちがあります。 私自身にこのような強い思いがあるので、 成果物をトップページのヒーローセクションには置かず、 より象徴的方向で考えることとしました。 テーマカラーは2通り用意し、 比較的ユーザーに求められやすい Home、Service、Contactのページを明るいテーマにし、 より深く理解してもらうための階層 About、Works、各実績紹介ページは暗いテーマにすることにしました。 深くwebサイトから世界観に飛び込んで欲しいので、ブラウザの四辺には縁を設け、 そこにナビゲーションやロゴタイプ、コピーライトを置きました。

Strand

各ページのヒーローセクションにはThree.jsで縄のCGを作り、それぞれのページごとにテーマや性質に合わせて変化を出しています。 全ての要素は「縄」や「繋がり」を暗喩するものにしています。 ナビゲーションのアクティブなページとHomeとを繋ぐ線。 各ボタン類のS字のラインと、ピンとあるアニメーション。 各ページのコンタクトセクションのS字のライン。 そうした暗喩のラインにはキーカラーであるライムイエローを用いています。 スクロールバーの色も合わせています。 それぞれの制作物には自分なりのなんとなくのイメージというのがあります。 制作物に合わせた中朝的な画像を背景に置き、成果物の写真をその上で見せる。 その際に、イメージの写真が邪魔しないように、ホバーされた時にぼかしと少し画像が拡大するようにしています。

Stranding Works Website image 1Stranding Works Website image 2Stranding Works Website image 3Stranding Works Website image 4Stranding Works Website image 5