見出し画像

スマホアプリ開発の会社が選ぶノーコードツール「STUDIO」と「Webflow」の違いと解説

こんにちは!
マンハッタンコードでプロジェクトマネージャー(以下PM)のみちこ(@MHTcode_michiko)とエンジニアのTOM(@MHTcode_TOM)です!

今回は弊社も愛用しているノーコードツール「STUDIO」と「Webflow」の違いと解説をさせていただければと思います。

なぜノーコードツールを導入したのか?

昨今プログラミングをすることなくWebサービスやアプリの開発ができるノーコードツールの人気が高まっています。
弊社にはWEBができるエンジニアも数名在籍していますが、ノーコードツールを使うと、ソースコードの記述をする必要がないため、プログラミング言語などのスキルを持たない非エンジニアでもサービス開発が可能になります。
環境構築の必要もなく、LPなどであれば1〜2週間ほどで公開することができるので発信の強化に期待ができるため導入を進めています。


導入した「STUDIO」と「Webflow」

STUDIOとWebflowは同じくノーコードツールですが、できる範囲に少し違いがあります。
筆者の2名は両方とも使用した経験があるので、少し偏りがあるかもしれませんが実体験をもとにそれぞれの違いを解説します。

画像1

STUDIOの利点は何と言っても直感的な操作が特徴でデザインのテンプレートなども豊富にあり、デザインツールを触っているような感覚で実装することができます。
ですが、CMS機能や他のツールとの外部連携には弱く複雑なページを実装するのであればSTUDIOは不向きでしょう

利点:階層の深くないLPページなどはすぐに作成できる
欠点:複雑な機能(CMSや外部ツールとの連携)はできないものが多い
利用者イメージ:デザイナー向けのノーコードツール

スクリーンショット 2021-08-23 17.27.19

エディターモードではデザインツールのような見た目をしており、各オブジェクトを掴んで位置を調整したりと直感的な動作を求められます。


画像2

WebflowはSTUDIOと同じく直感的な操作やレスポンシブデザインに対応できるところもそうですが、CMS機能を用いて、ブログや商品などを扱う動的なWebサイトを開発することが可能です。
拡張性が高く、直接JavaScriptのコードを入力できる点はSTUDIOとの大きな違いと言えるでしょう。
できる範囲が多いが故に非エンジニアなどは使い出しから慣れるまでに少し時間がかかると思います。

利点:CMSなどのテンプレートはあるため動的なWebサイトを開発が可能
欠点:開発の知識がないと使いなれるまでに時間がかかる
利用者イメージ:WEBエンジニア向けのノーコードツール

スクリーンショット 2021-08-23 17.29.12

STUDIOとは違い、選択したものを掴んで動かすのではなく右のLayoutなどで調整を行います。
CSSをぽちぽち決めていけるとイメージしていただくのが良さそうです。
一見複雑そうに見えますが基本的に使う物などは限られてくるのでSTUDIOと操作感はそこまで変わりません。

実際にSTUDIOで作成したもの

弊社では、エンジニアが設計ドキュメントの無いシステムの分析を行って設計書を書き起こすサービス「doc-made」というサービスを実施しており、こちらのLPは全てSTUDIOを使い2週間で実装しました。
このような簡単なLPであればレスポンシブ含めて速度早く実装することができるので、おすすめです。

doc-madeとは?
設計書が更新されていないプロジェクト, リリース間近で開発しながら設計書も書かないといけないエンジニアさんの負担を軽減させるサービスです。
詳細は是非LPをご確認ください。

まとめ

STUDIO:デザインツールに近い形で実装が可能、簡単なLPページを作るのにオススメ
Webflow:開発の知識があると便利だが、色々なことができるため操作は少し難しい、CMS機能などを入れたWebサイトを作るのにオススメ

今回紹介したSTUDIOとWebflowはWEBに特化したノーコードツールですが、それ以外にもシステム・アプリ開発に特化したツールもあるので、必要なものを調べてみると良い情報が出てくるかもしれません。
弊社も実際にノーコードツールを使ってWEBサイトを納品した経験もあるので検討しても良いかもしれません。

注意点としては共同編集機能がまだ実装されていないので、複数人での開発をやる際は要注意です!
特にWebflowは編集中に同じアカウントが別端末にログインしてしまうと編集中のデータが全てなくなってしまうので気をつけましょう。
チーム開発ができるプランもあるので、必要に応じてプラン加入を検討ください。


宣伝

お仕事のご相談・ご依頼
マンハッタンコードは、スマートフォンアプリの開発に特化しております。エンジニアリングから、デザイン、プロジェクト推進などアプリ開発を総合的に請け負うことが可能です。
また、デザイン環境の構築などもお手伝い可能ですので、弊社のホームページからぜひお問い合わせください。

お問い合わせの際には「noteの記事を読みました!」と一言入れていただけると嬉しいです!

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