新しく「STUDIO」を導入したワケ
ツクリンク株式会社のアドベントカレンダー23日目の記事へようこそ！
ツクリンク株式会社プロダクト部デザイナーのSUGIRYUです。
今年3月にフリーランスからジョインしました。
今回、弊社に新しく導入したWEBサイト制作サービス「STUDIO」についてお話ししたいと思います。
導入の経緯・目的
通常、WEBサイトを制作する際は要件定義からワイヤー引き、デザイン制作の後、コーディングまたはフロントエンジニア実装後、本番公開します。
その前後に各ブラウザやデバイスの調整が入るかと思います。
LPでもコーディングから公開までに1〜2ヶ月以上かかります。
更に制作中に要件変更やデザイン変更などなど修正が入れば更に公開スケジュールが伸びます。
上記のスケジュールを短縮でき、かつデザインのクオリティーをデザイナー側で実装から保守・運用までできるノーコードを導入すれば、より早くPDCAを回せる手段として「STUDIO」を導入しました。
導入してみた結果
良かった点
１、実装と開発工数の短縮
まず、公開まで大幅なスケジュール短縮ができました。
実装部分までデザイナー側でハンドリングできる為、表現したい部分のズレや、調整などのズレが減り想像していた以上に公開が早くなりました。
開発工数を下げる事が出来た分、要件詰めやデザイン制作に時間を取れる様になりました。
２、デザイン拡大
「Figma to STUDIO」というプラグインが利用できる為、Figmaで作成したデザインを反映できる点は非常に有難いです。
※若干の調整が必要ですので、確実に反映させたい場合はSTUDIOから出ているサンプルページがオススメです。
３、より表現の幅が広がった
「アニメーション」「Lottie Files」追加。自身でサイト自由に調整できる「カスタムコード」が導入により、デザイナーがイメージした通りのカタチを表現できる様になりました。
とはいえ、良い事だけではありません。
使用するにあたり苦労する部分もあります。
苦労した点
１、各デバイスの調整
STUDIOには各デバイスに合わせたブレイクポイントを決められ、それぞれにスタイルを設定する事ができます。但し、5つのブレイクポイントで柔軟なレスポンシブ対応の為、本当に全ブラウザ毎の対応には各自でコードを書く必要があると感じました。その点は割り切った方が良い気がします。
２、プラグインの仕様
「Figma to STUDIO」というプラグインを利用し、Figmaで組んだLPをまるまる反映すると、表示されずレイヤーも消せないという事例も起き、最終的にはセクション毎にデータを反映させる事で、問題を解消できました。
時にはデフォルトにあるセクションパーツを利用しながら実装の方が早い場合もあります。
３、操作・キャッチアップ
最初は操作に慣れるのに時間が掛かりました。機能について独特な表現もあり、「これはどういう意味？」と何度か調べる事が多くあり、キャッチアップに時間が掛かりました。基本的な操作については動画ある分、その点は非常に助かりました。
今後の運用について
弊社では、当初マーケティングに振った運用手段として、導入しました。
今後は広告運用に合わせたLP制作とLPOを行いながら、ABテストとしても運用や共同編集機能を利用した運用方法など色々と試していきたいと考えております。
最後までお読みいただき、ありがとうございました！
明日以降も記事が投稿されるますので、是非読んでみてください。