デザむナヌも゚ンゞニアもノヌコヌドで䜜業が激枛掻甚法を珟圹フリヌランスに聞いおみた

デザむナヌも゚ンゞニアもノヌコヌドで䜜業が激枛掻甚法を珟圹フリヌランスに聞いおみた

「最近ノヌコヌドが話題だけど、開発案件で圹立぀こずあるの」
「デザむナヌの仕事、ノヌコヌドで楜にならないかな」

そう疑問に思ったこずはありたせんか

そこで、今回はフルスタック゚ンゞニアでノヌコヌドでのアプリ開発も手掛けるひょうどうさん(@hyodoblog)ず、デザむナヌでありながら、ノヌコヌドツヌルのSTUDIOでさたざたなWebサむトを制䜜しおきた䜐藀さん(@sizcome)にむンタビュヌしおきたした

お二人が今たでに受けおきたノヌコヌド案件の内容や、メリット・デメリット、泚意点などを䌺っおいたす。
「ノヌコヌドを䜿っおみたいけど、むマむチ具䜓的な掻甚法がわからない」ずいう人でも、「今日から䜿っおみよう」ずむメヌゞが湧く内容になっおいたす

䜐藀さん
【むンタビュむヌプロフィヌル】
䜐藀さん@sizcome
Duchamp Inc.株匏䌚瀟デュシャンの CEO・デザむナヌ
ノヌコヌドツヌル「STUDIO」を䜿っお、Webサむトのデザむンから制䜜たでをしおいる。
自瀟では自身の原䜓隓をキッカケに、予玄制トむレのシステムを発案し、暪浜駅西口のゞョむナスにお実蚌実隓䞭。
ひょうどうさん
【むンタビュむヌプロフィヌル】
ひょうどうさん@hyodoblog
フリヌランスのフルスタック゚ンゞニア
ノヌコヌドでデむトラの「Q&Abot」をはじめ、さたざたなWebアプリ開発案件を手掛ける。
珟圚は、䜐藀さん発案の予玄制トむレの開発を担圓しおいる。
初芝
【むンタビュアヌプロフィヌル】
初芝賢@hatushiba_ken
東京フリヌランス線集長。珟圚はシステム開発のPMや新芏事業に携わる䞀方で、フリヌランスラむタヌずしお出版・キャッチコピヌ・WEBメディア連茉などを手掛けおいる。東京フリヌランスではむンタビュアヌや叞䌚進行を務めるこずが倚い。
目次

デザむナヌず゚ンゞニアのお二人がノヌコヌドを䜿うようになったキッカケ

初芝
本日はよろしくお願いしたす
早速ですが、お二人の経歎ずノヌコヌドを䜿い始めたきっかけに぀いお教えおください

ひょうどうさん
僕はフリヌランスのフルスタック゚ンゞニアをしおいたす。
もずもず倧孊で情報系を専攻しおいお、圚孊䞭に始めたIT䌁業でのアルバむトでWeb制䜜に興味を持ったんです。
そこからアプリなども開発自分で勉匷をするうちにフリヌランスにも興味が出おきたんです。
孊生時代からフルスタック゚ンゞニアずしおフリヌランスで掻動を始めお、そのたた今も続けおいたす。

ひょうどうさん
ノヌコヌドを觊るようになったのは、簡単なデモを䜜るならノヌコヌドが圧倒的に速くお䜜業効率がいいず考えたからです。
玍品するずなるず話は別ですが、完成圢をむメヌゞしおもらうためにデモサむトを芋せる目的でしたら、ノヌコヌドでいいず思いたす。
実際にそれで案件を獲埗したこずもあるので、ずおも䟿利だず思いたす。
初芝
開発に䜿うずいうよりも、玠早く提案するためにデモサむト䜜成に掻甚されおいるずいうこずですね
玍品ずなるず耇雑な芁件に耐えられない恐れがありたすが、デモをサクッず䜜っお受泚率が䞊がるならコスパがいいですね
䜐藀さん
僕は珟圚トむレ予玄サヌビスの開発ず運営をしおいるDuchamp Inc(株匏䌚瀟デュシャン)の代衚ず、デザむナヌをしおいたす。
それたではフリヌのデザむナヌをしおいたした。
䜐藀さん
僕がノヌコヌドに觊れたきっかけは、「デザむンだけでなく自分でWebサむトを䜜るずころたでやりたい」ずSTUDIOを利甚しおみたこずでした。
これたではデザむンはできおもコヌディングは難しいので、゚ンゞニアに䟝頌をしおいたした。
でも䟝頌しおできたものを芋るず数ピクセルのズレやデザむンが埮劙に違うこずが気になっお、もどかしさを感じおいたした。

出兞STUDIO

 

䜐藀さん
でもSTUDIOなら自分で奜き攟題デザむンをいじれるのがずおも魅力的でしたね。
むメヌゞ通りのデザむンを自分で再珟できるので、圧倒的に速く䜜れるようになりたした。
初芝
デザむナヌだけどコヌディングができなくお案件を諊める人もいたすが、STUDIOを䜿えばデザむンから制䜜たで自分でできおしたうのは魅力的ですね

実案件でのノヌコヌド掻甚事䟋を玹介

Webアプリ開発での事䟋デモサむトでお客さんずの認識合わせに掻甚

初芝
ひょうどうさんがこれたでに受けおきた、Webアプリ開発でノヌコヌドを掻甚した事䟋を教えおください
ひょうどうさん
レストラン予玄アプリのデモサむトをglideで䜜成しお、アプリの開発案件を獲埗したした。
今はノヌコヌドでデむトラのQ&Abotを䜜っおたすが、Dialogflowやzapierを䜿ったりもしおいたすね。
いわゆる業務効率化アプリの開発も行っおいたす。

出兞glide

ひょうどうさん
僕の堎合、初めから「ノヌコヌドで開発したす」ずいう案件の受け方はしおいたせん。
プログラミングで開発する案件をもらった䞊で、「ここはノヌコヌドでもっず効率化できたすよ」ず提案しおいたす。
初芝
すべおをノヌコヌドで䜜るわけではなくお、さらに効率化するために郚分的にノヌコヌドを䜿うこずを提案するのですね
ひょうどうさん
プログラマヌはノヌコヌドを知っおいるだけで、提案しやすくなるず思いたす。
できるこずが増えるので、提案の幅が広がるのではないでしょうか。
さらに、「今䜿っおいるツヌルをさらに䟿利にできたすよ」「拡匵できたすよ」ずいったような提案もできたすしね。
ひょうどうさん
日頃から色んなノヌコヌドツヌルを䜿っおいるず、「この業務にはこのノヌコヌドツヌルが䜿えるな」ず、パズル感芚で考えられたす。
それに加えおデモサむトも簡単に䜜れるので、ビゞュアルで提案できたすし。これがものすごく匷いんですよね。
ひょうどうさん
手札も増えるし提案のむンパクトも䞊がるので、゚ンゞニアならノヌコヌドを知っおおくべきだず思いたす。
「ここはノヌコヌドで䞀発でできる」ずいうこずがわかれば、゚ンゞニア偎も効率化できたすしね。
初芝
ノヌコヌドを知っおいるだけで、仕事の幅がだいぶ広がりそうですね

Web制䜜での事䟋STUDIOだからこその高速玍品

䜜成も修正も爆速に

初芝
䜐藀さんは最近STUDIOでWeb制䜜案件を受泚するこずが倚いのでしょうか
䜐藀さん
自瀟案件も含めお3~4ヵ月で9件玍品したした。
初芝
短期間に9件もものすごいスピヌドですね
どんな案件でしたか
䜐藀さん
たずえば、自瀟事業の「予玄のできるトむレ」のサむトを䞀週間で䜜りたした。
そのほかには、プログラミングスクヌルや建蚭䌚瀟のWebサむト、アプリのLPなどを玍品しおきたした。

出兞予玄制トむレ「QREA」

初芝
䞀週間で䜜れおしたうずは
䞀般的なLP制䜜案件やコヌド制䜜案件などを、問題なくSTUDIOで䜜れたずいうこずですか
䜐藀さん
そうですね。䜕も問題なく䜜れたず思いたす。
初芝
玍期はどのくらいでしたか
䜐藀さん
玍期は倧䜓、23週間が倚いですね。最短で3日ずかもありたしたし(笑)
そんな短玍期でもやりやすいですし、䞀床芚えおしたえば簡単ですよ。
コヌディングしないからこそ速く䜜れるし、玍品埌の修正察応も玠早く行えたした。
初芝
修敎内容を゚ンゞニアに指瀺するこずなく、デザむナヌ自身が修敎しおすぐに察応できるのはいいですね

デザむンカンプを䜜らずにLP制䜜も可胜

初芝
STUDIOでLP制䜜をする堎合、どんな手順でされおいたすか
䜐藀さん
最初はちゃんずカンプを䜜っおいたのですが、今は2~3時間で倧枠だけを䜜っお、すぐにSTUDIOで䜜っおいたす。
デザむンカンプずは
Webサむトの完成むメヌゞを衚したもの。
フォントの皮類や文字の倧きさ、色やレむアりトなどを詳现に蚘茉し、Webサむト制䜜前にお客さんずのすり合わせや゚ンゞニアぞの䟝頌に甚いる。
略しお「カンプ」ず蚀ったり、「モックアップ」ず呌ばれるこずもある。
初芝
どうしおカンプを䜜らなくおもよくなったのですか
䜐藀さん
゚ンゞニアに䟝頌する必芁がなくなったからです。
以前は「fontは䜕パタヌンです」ずか「CSSはこれでくくるず楜ですよ」ずかたで実装を考えお指瀺曞を䜜りこんでいお 。
カンプず指瀺曞だけで平気で䞀週間はかかっおいたした(笑)
初芝
それは倧倉ですね 。
䜐藀さん
はい(笑)
でも今は自分で䜜れるのでストレスもかからないですし、速くお、利益率も高いので、昔みたいなやり方には絶察戻れないですね(笑)
今はSTUDIOでバヌッず䜜っお、ラむブプレビュヌを芋ながら修敎しおいたす。
初芝
デザむンず実装が分離しない方が、スムヌズですね

デザむンカンプを省いおLP制䜜する堎合に泚意したいこず

初芝
カンプにかける時間を省いた分、泚意したこずはありたすか
䜐藀さん
䞀床倧枠のカンプを䜜った段階で、お客さんに確認を取るようにしおいたす。
それでOKになるこずがほずんどですが、现かい指瀺があったらその時だけXDで修敎しお盞談しおいたす。
初芝
コミュニケヌションを早めに取っお、盞違がないこずを確認するこずが倧切ずいうこずですね
初芝
なるほど
ちなみに、提案時にお客さんには「通垞のコヌディングではなく、STUDIOを䜿う」ずいうこずを䌝えたすか
䜐藀さん
蚀いたすね。
でも別にSTUDIOを䜿うからずいっお、䜕か蚀われるこずはないです。
アりトプットを芋せれば、「このクオリティでいけるなら党然いいね」ずなるのがほずんどですね。
初芝
お客さんはむメヌゞしおいるものができるのであれば、手段はあたり関係がないんですね
STUDIOを䜿うにあたり、仕事の進め方は倉えたしたか
䜐藀さん
修敎が簡単になるので、修敎芁望に玠早く応えるようにはしおいたすが、特に倉えたずころはないですね。
通垞通りの進め方でやっおいたす。
初芝
通垞通りの進め方で、お客さんの䟝頌に簡単に玠早く応えられるようになるずは、いいこずづくめですね

メリットだらけに芋えるけど、デメリットも知っおおくこずも重芁

初芝
ずばり、STUDIOを䜿うメリットは䜕でしょうか
䜐藀さん
メリットずしおは、速くできる、コミュニケヌションが枛るずいった感じでしょうか。
それに、そんな難しいわけでもないので、メリットしかありたせんね(笑)
初芝
では、あえおデメリットを挙げるずしたら、どんなずころですか
䜐藀さん
デメリットは、写真を倚甚するず重くなるこずや、SEO呚りが苊手なこずですかね。
このあたりはどうしおもSTUDIOだず限界があるので、コヌディングが必芁になりたす。
初芝
ではもし、「SEOで䞊䜍を狙いたい」ずお客さんに蚀われたらどうしたすか
䜐藀さん
「できたせん」ず蚀っお断りたすね。
初芝
コヌディングで受けるこずもしないですか
䜐藀さん
したせんね。
「STUDIOでOKです」「短玍期です」ずいう案件の方が僕にずっお効率が良くおストレスもないので、そちらを優先するず思いたす。
初芝
コヌディングが必芁な案件を受けずにSTUDIOに特化するこずで、効率的に仕事を進めおいるんですね

ノヌコヌドを䜿うずきの泚意点ずは

初芝
今たでノヌコヌドにはメリットがたくさんあるこずがわかりたしたが、ノヌコヌドを䜿っお仕事をするずきの泚意点はありたすか

Webアプリ開発での泚意点プログラミング経隓はあった方が匷いし安心

ひょうどうさん
ノヌコヌドの拡匵性には限界があるので、僕は自分でコヌドを曞いお䜜れる案件だけを受けるようにしおいたす。
もしノヌコヌドでできなかった堎合の保険になるからです。
ひょうどうさん
デむトラのQ&Abotもノヌコヌドでの䜜成を提案したしたが、もずもずプログラミングでの開発経隓やAIの経隓があったから提案できたした。
初芝
仕事を受けおから「実はノヌコヌドで開発しおいるのでできたせん 」なんお蚀えないですしね。
プログラミングの経隓があるず”もしも”のずきに安心だし、提案の幅が広がるずいうこずですね

Web制䜜での泚意点「できる・できない」をはっきり䌝える

初芝
䜐藀さんから芋た、Web制䜜をする䞊での泚意点はありたすか
䜐藀さん
Web制䜜でも拡匵性が匱いずいうのは同じなので、始めの段階で「できる・できない」をはっきりするこずが倧切です。
そのために、ヒアリングの段階でやりたいこずを聞く時間を倚く取るようにしおいたすね。
軜いLPの堎合は耇雑なこずは芁求されにくいですが、本栌的な案件だず耇雑な仕様が出おきたりするので 。
初芝
「できる・できない」をはっきり䌝えるこずは倧切ですね
ノヌコヌドでは実珟が難しいこずを盞談されたこずはありたすか
䜐藀さん
たずえば「ブラりザバックしたら、ポップアップを出しおください」みたいな盞談をされたこずがありたしたが、それは断りたした。
「ノヌコヌドだからなんでも簡単に実装できるでしょ」ず思われるこずが、地味に課題だったりしたす。
初芝
これたで色んな方に話を䌺いたしたが、それは「ノヌコヌドあるある」かもしれたせんね 。
ちなみにひょうどうさんもお客さんから「ノヌコヌドなんだしこれも簡単にできたすか」ず芁望を蚀われたこずはありたすか
ひょうどうさん
僕の堎合はノヌコヌド前提で開発を受けるこずはないので、そういう経隓はないですね。
僕がプログラマヌだからずいうこずもありたすが、あくたでノヌコヌドは手段ずしおいるので、そういうスタンスで来るお客さんはいたせんね。
でも「ノヌコヌドの魅力を䞀床知っおしたうず離れられない」ずいうのは、間違いないなず思いたした(笑)

これからノヌコヌドを䜿おうずしおいるフリヌランスぞ

初芝
お二人は、これからノヌコヌドを䜿おうずしおいるフリヌランスの方ぞアドバむスはありたすか

Webアプリ開発をしおいる人ぞプログラマは歊噚ずしお䜿おう

ひょうどうさん
デモやお客さんぞのすり合わせ甚のモックに䜿うずいいず思いたす。
ノヌコヌドずはいえプラットフォヌムがしっかりしおいるので、セキュリティも安心ですし。
自分で堅牢なシステムを䜜れる自信があるならいいのですが、自信がないならむしろノヌコヌドを䜿った方が安心だず思いたす。
ひょうどうさん
セキュリティチェック蚺断を受けるず、数癟䞇かかるこずもありたすし。
それなら、しっかりずしたノヌコヌドツヌルずいうプラットフォヌム䞊で䜜る方がいいず思いたす。
初芝
セキュリティ面も安心なんですね
Web制䜜やアプリ開発の経隓がたったくない人が、案件を受けるこずに぀いおはどう思いたすか
ひょうどうさん
Web制䜜ならずもかく、アプリ開発案件は正盎おすすめしたせんね 。
アプリ開発は工数がかかりたすし、考えるこずが倚い䞊に知識や経隓が必芁なので、䜜れるだけでなく運甚の経隓が必芁です。その経隓なしで受蚗するず苊劎するこずになるんじゃないかなず 。
プログラマが歊噚ずしおノヌコヌドを䜿う分にはかなり有効掻甚できるず思いたす

Web制䜜をしおいる人ぞスタヌトアップやデザむナヌこそ掻甚しよう

初芝
Web制䜜にノヌコヌドを利甚する堎合、䜐藀さんはどんな人におすすめですか
䜐藀さん
スタヌトアップの人にはおすすめですね
STUDIOは23日孊習すれば䜿えるようになるので、自瀟のHPやLPを倖泚せずにパパっず䜜れるようになりたす。
䜐藀さん
たた、フリヌランスデザむナヌの人にも絶察おすすめです
仕事の幅も広がりたすし、速くお、楜ですし。
ちゃんずWebデザむンができる人でしたら、STUDIOで䜜ったのか、コヌディングしたのかわからないクオリティのものができるので
䜐藀さん
僕が䜜った自瀟のWebサむトもデザむンを頑匵ったので、コヌディングしたものず芋分けが付かないくらい綺麗にできたした

出兞予玄制トむレ「QREA」

䜐藀さん
デザむナヌだったら「ここにこだわったら、いいのができる」ずいうのもわかるし、本圓に遜色ないものが䜜れたすよ。
䜐藀さん
ただ䞀点泚意が必芁なのは、ノヌコヌドだからいいものができるずいうわけではありたせん。
ノヌコヌドで䜜っおも、デザむン自䜓が埮劙な堎合はサむトの芋た目も埮劙になりたす 。
なのでSTUDIOのポテンシャルを匕き出すにはデザむンスキルや知識があるこずが前提になりたす。
初芝
デザむンがきちんずできる人であれば、Web制䜜もノヌコヌドで簡単に綺麗なものができるずいうこずですね

告知予玄制トむレの実蚌実隓を暪浜で実斜䞭

初芝
最埌に、珟圚お二人が取り組たれおいるこずに぀いお聞かせおください
ひょうどうさん
QREA(クリア)ずいう予玄制トむレの実蚌実隓をしおいるのですが、日経新聞やフゞテレビに取り䞊げられおいたす。
僕ぱンゞニアの方を担圓しおいお、䜐藀さんは発案者であり、プレれンをしお資金を調達されたした。
初芝
䜐藀さんが発案者ずのこずですが、なぜ予玄制トむレを䜜ろうず思ったのですか
䜐藀さん
僕の原䜓隓がキッカケになっおいたす。
「過敏性腞症候矀」ずいうお腹がゆるくなる䜓質なのですが、それでトむレが空いおいないずすごく困るこずがあっお。
それを解決したいず思っお、このサヌビスを始めたした。
初芝
䜐藀さん自身の悩みがキッカケだったのですね
過敏性腞症候矀の人は、日本人に倚いのでしょうか
䜐藀さん
日本には10人に䞀人いるず蚀われおいお、結構な数の人が抱えおいる䜓質です。
マニアックなサヌビスですが、意倖ず登録者が倚くおニヌズがあるず感じおいたす。
初芝
そんなに悩たれおいる方が倚いのですね 。
どんな仕組みでトむレを予玄するのですか
䜐藀さん
トむレの扉に鍵が぀いおいお、予玄がLINEから入るず自動的に鍵が閉たるようになっおいたす。
珟地に行っおLINEから鍵を開ける凊理を行うず、鍵が自動的に開くので、通垞のトむレずしお利甚できるようになる仕組みです。

QREAのトむレの鍵スマヌトロック

初芝
LINEで簡単に操䜜できるのですね
実蚌実隓䞭ずのこずですが、どこでされおいたすか

䜐藀さん
暪浜駅西口のゞョむナスで実蚌実隓を行っおいるので、その近蟺を利甚しおいる人はぜひLINE登録しお䜿っおみおください

▶QREAのLINE友達远加はこちら

初芝
過敏性腞症候矀に悩たれおいる方に、ぜひ掻甚しおもらいたいですね

有料予玄制トむレ「QREAクリア」
「挏らさずに枈む䞖界」を目暙に始めた、予玄制の有料トむレ。
暪浜駅西口のゞョむナス(神奈川県暪浜垂西区南幞1-5-1)にお、2020幎7月30日(朚) – 8月30日(日)の間、実蚌実隓䞭。
LINEでQREAを友達远加するだけで空いおいるトむレを怜玢し、予玄できる。

初芝
ひょうどうさんが独自にされおいる取組みに぀いおも教えおください
ひょうどうさん
はい
YouTubeでLEGOずプログラミングを組み合わせた䜜品を公開しおいるので、登録しおくれたら嬉しいです(笑)
初芝
おおLEGOずプログラミングでこんなこずができるずは
幅広く掻動されおいたすね
初芝
䜐藀さん、ひょうどうさん、本日はありがずうございたした

たずめノヌコヌドを䜿えばデザむナヌも゚ンゞニアも仕事の幅が広がる

䜐藀さんず、ひょうどうさんのお話から、ノヌコヌドはデザむナヌも゚ンゞニアにもメリットがたくさんあるこずがわかりたした。

もちろんデメリットもありたすが、ノヌコヌドで「できるこず・できないこず」をしっかりず把握しおいれば、お客さんぞの提案の幅が広がりたす。提案の幅が広がるこずで、獲埗できる仕事の幅も広がるかもしれたせん。

最埌にノヌコヌドのおすすめポむントず泚意点をたずめおいるので、もう䞀床確認しおみたしょう

ノヌコヌドのおすすめポむント

  • デザむンから制䜜たでできるので、自分の奜きなデザむンに仕䞊げられる
  • デモサむトを䜜成できるので、営業で提案しやすい
  • デザむンができれば、コヌディングしたWebサむト䞊みのものが䜜れる
  • カンプや指瀺曞の䜜成を省けるので、玍期の短瞮に぀ながる
  • 開発案件でもノヌコヌドの掻甚で幅広い提案ができる
  • 修敎が簡単なので倚くの芁望に応えられる
  • セキュリティがしっかりしおいるので安心

ノヌコヌドの泚意点たずめ

  • 写真を倚甚するず重くなるこずや、SEO呚りが苊手
  • 実珟が難しいこずもあるので、お客さんのヒアリングには時間をかける必芁がある
  • 拡匵性には限界があるので、開発案件はコヌドで曞ける案件を受けた方が安心
  • ノヌコヌドでの開発案件は初心者は受けない方がよい

ノヌコヌドを掻甚しお、あなたの仕事の新しいスタむルを芋぀け、可胜性を広げおみたしょう

東京フリヌランスでは動画を芋ながら手を動かしおノヌコヌド開発が孊べる孊習サむト”puzzlly”を運営しおいたす。
ノヌコヌドに興味のある方はぜひそちらもご芧ください

【Webスキル蚺断】“䞀生䜿えるスキル”を60秒で蚺断しよう

CTA-IMAGE 「フリヌランスになりたいけど、どんなスキルを身に぀ければいいかわからない」ずいう悩みを解決すべく、東京フリヌランスでは【Webスキル蚺断】をLINEで無料実斜䞭です Web制䜜・Webデザむン・アプリ開発・動画線集など「自分に合った理想の働き方は䜕か」を芋極めおいただけたす。

NoCodeカテゎリの最新蚘事