見出し画像

【デザインニュース】vol.25 ノーコードツール"Studio"で広がるデザイン|『タイムトリップしよう、常陸国ロングトレイルで。』

■トークメンバー
長津:カドベヤCOO/弊社WEBディレクターの長(おさ)的存在
須田:UIデザイナー/ゲーム・ドラムに日々没頭
古川:PdM/クリエイティブ部マネージャー
飯野:PdM/カドベヤのお兄ちゃん、ゲーム・アニメ・SEOがすき


🔳 今週のピックアップ【タイムトリップしよう、常陸国ロングトレイルで。|茨城県

UIデザイナー須田によるデザインコーナーvol.25。
今週の須田的ベストデザインはタイムトリップしよう、常陸国ロングトレイルで。|茨城県

引用元:https://hlt.pref.ibaraki.jp/

須田(UID):
今回は「
タイムトリップしよう、常陸国ロングトレイルで。|茨城県」という観光サイトを紹介します。

(縦バージョンもすてき)

長津(COO):
常陸国ってどこだ?

須田(UID):
茨城県北のハイキングコースですね。
割と水彩画っぽいイラストを全体的に使っててすてきです。

須田(UID):
通常、縦書きを混ぜるとデザイン的に難しくなっちゃうんですけど、
このサイトはキレイにまとまっていてすごいですね。

長津(COO):
ほんとだね。

須田(UID):
これ調べてみたら『
Studio』で制作してるみたいなんですよね。

引用元:https://studio.design/ja

長津(COO):
えぇっ!これスタジオでできるの?

須田(UID):
みたいですね。

須田(UID):
すご。。これスタジオでできちゃうんだ。。

古川(PdM):
どういう感じでスタジオが活躍してるんですかね?
どういうカスタマイズをしてるか知りたいですね(笑)

須田(UID):
Re:designさんというSTUDIOに特化したチームが制作していますね。
メンバーはNEWPEACE Inc.さん、Wab Design Inc.さんがいました。

長津(COO):
そうそうたる顔ぶれだな。

須田(UID):
SP版もキレイで、ほぼ破綻してるところがないですね。

長津(COO):
スマホでもみれるんだ。

須田(UID):
縮小しちゃったイラストもちゃんと拡大表示できますね。
強いていえば、トレイルまでのアクセス表示が少し見づらかったかな?

須田(UID):
この図形は縦にできたと思うんですけど、横のままにしていますね。

長津(COO):
そこがスタジオって感じがするけどね。

須田(UID):
そうですね。しかもほとんど画像ですね。

長津(COO):
じゃあ結構いろんなところが画像なんだね。
旅程見本の部分は?

須田(UID):
これはspanで無理やりテキストを入れたり画像を組み合わせてますね。
時間の部分は、インジケーターが動いていたのでちゃんと実装してますね。

長津(COO):
すんげええええ!
旅程見本のところは、spanだからSEO的には微妙?

飯野(PdM):
多分外側にかかってますね。
全体が囲まれてるので、SEO的にも大丈夫だと思いますね。

長津(COO):
スタジオってそこまで使えるんだねぇ。

須田(UID):
スタジオ実装もすごいんですけど、大きいイラストが3枚あるファーストビューのセクション、映像体験のセクション、そしてフッターで合計大画像4枚ぐらい使ってるんですけど、特に複雑なトランジションとかがないのがすごいですね。

須田(UID):
あと、雲とか山できれいに世界観を切り替えているので、ぜひ私も参考にしたいですね。

長津(COO):
このサイトのアートディレクション・デザインをしているWab Design Inc.さんもきれいなサイトだね。

須田(UID):
そうですね。

長津(COO):
須田ちゃんってワブさんたまにデザインニュースで話題に出してくるよね。
SHIFTBRAIN inc.さんとともにね。

須田(UID):
たしかに!
企画進行プロデュースをやってるNEWPEACE Inc.さんのコーポレートサイトは、STUDIO DETAILS Inc.さんがGoodpatch Inc.さんとタッグを組んでリブランディングしてましたね。
SOTDにもノミネートされてました。

引用元:https://newpeace.jp/

長津(COO):
実力者揃いだね。

須田(UID):
この辺のディレクションとか大変なんだろうな~。でもかわいい。

長津(COO):
カドベヤHPのデザインでも参考にしたいからめっちゃ見ます!
じゃあ今日はここまで。アディオス!

いいなと思ったら応援しよう!