元声優のWEBデザイナーがプログラミング学習！別荘マッチングサービス制作秘話

こんにちは！
侍エンジニアブログ編集部のナナミです。

みなさん、学習する時しっかり手を動かせていますか？

プログラミング学習はコードを覚えるのではなく、アプリなどを作りながらエラーと戦うのが一番の近道。侍エンジニアは、そうして多くの人の学習を成功に導いてきました。

そんな成功者の一人、WEBデザイナーでありながらプログラミングを学習して、新しいサービスを生み出した渡部さんにインタビューをさせていただきました！

渡部さんは元声優のWEBデザイナーというちょっと変わった経歴の持ち主。なぜWEBデザイナーという道を選んだのか、なぜデザイン・コーディングだけでなくプログラミングも学んだのかもあわせてお伺いしました！

なんてお悩みがある方、必見です。

【Webデザイナーがレベルアップできる侍エンジニアのサービス詳細はこちら】

声優とWEBデザイナーは相性がいい？

ナナミ：プログラミングを学習する前から、ディレクション、デザイン、コーディング、アクセス解析とWEB制作全般でご活躍されているとのことですが、そもそもWEB制作に携わろうと思ったのはなぜですか？

渡部：元々声優として事務所に所属していたんです。でもやっぱり最初って声優一本じゃ食べて行けないんで、基本的に二足のわらじを履いている人がほとんどなんです。ただ、急にオーディションや仕事などが入ってしまうと、急に「明日休みます」とか、うまく都合がつけられなくなったりする状況も出てくると思うんですよね。

そうなった時に自分の家で自分のタイミングでやれる仕事って何かないかなと思っていたら、WEBデザイナーっていうのを知ったんです。ちょうど同時期にWEBデザインをやっている知り合いができたので、そこから始まりましたね。フリーランス歴はそろそろ3年目くらいです。

ナナミ：同じように声優とIT系の仕事を掛け持ちしている人って結構いたんですか？

渡部：今も知人の7～8割くらい声優なのですが、IT関係はあんまりいないですね。

個人的にはオススメしてるんですけどね。自分のタイミングかつ家でできるのはやっぱり魅力だと思うので。

ナナミ：新しいスキルの習得って大変だなと思うんですが、デザイン・コーディング等のWEBデザイナーのスキル習得や、フリーランスとして仕事が軌道に乗るまでどのくらいかかりましたか？

渡部：WEBデザインのスキル習得という意味では、デザインとコーディングが一通りできるようになるまで自分は大体一年くらいだったかなと思います。一通りという定義がどこからどこまでを指すのかは個人の解釈によって変わりそうではありますが(笑)

最初は独学から始めて、そのあとIT系の企業で実務として携わらせていただきつつ、並行して仕事終わりにそのままWEBデザインのスクールに通うということもしていました。もちろん自宅でも学習していましたね。

フリーランスの仕事に関してははたして軌道に乗っているのかどうかはわかりませんが(笑)　フリーランスになった当初も、知人などからお仕事はあったのでその点に関してはとてもありがたかったです。

ナナミ：そこからWEBデザインに止まらずWEB解析まで幅広くご活躍されてるとのことですが、上級WEB解析士を取ろうと思った理由はなんですか？

渡部：以前の職場がWEB制作会社だったんですが、そこで社内の人間が「ウェブ解析士マスター」という上位の資格を持っていて、業務としてウェブ解析＋レポート作成もやっていたんです。

その流れで自分も実際に業務として携わらせていただいた事で、はじめてウェブ解析士という技術・資格がある事を知り、これからIT業界で生きていく上で必要性・需要などを感じた事もありフリーランスになってから正式に資格を取得しました。

現在はECに携わる仕事が比較的多く、売り上げ、アクセス数などの分析もするのでとても相性の良いスキルだと思います。

これからのWEBデザイナーはコーディングスキルも必須

ナナミ：幅広くWEB制作のスキルや資格などお持ちの中、エンジニアの知識もつけようと思ったきっかけはなんですか？

渡部：以前からプログラミングに興味があったんです。WEB制作以上にサービスやアプリが開発出来れば世界が広がりそうだなと思っていました。

あとは自分の単価というか価値をあげたかったのもありますね。おそらく今の時代ではプログラミングが一番費用対効果の高いスキルなんじゃないかと思っています。

ナナミ：WEB制作の現場を見ていても、エンジニアの価値は高く感じていたんですか？

渡部：はい、高いと思いますね。だからサービス開発、アプリ開発のスキルを持っているのは大きいなと感じています。

ナナミ：デザイン・コーディングなどのWEBデザインもプログラミングも、それぞれ独立しても魅力的なスキルかなと思うんですけど、「両方やっていてよかった」と思うことはありますか？

渡部：WEBデザインとプログラミングはまた畑が違うので、単純に作業領域が広く重宝されるかなというのはありますね。

あとデザイン・サイト制作・サービス開発と自分の作りたいと思ったものを自分で自由に作れるのも魅力だと思います。WEB制作にしても、「デザインはできるけどコーディングができない」「コーディングはできるけど、デザインができない」というパターンが結構多いので(笑)

どちらもできれば依頼する方も一括で投げられるので、受注率や単価も上がるのではないかなと思います。両方の知識を知っている事で、出来る提案・出来ない提案などの判断もでき、全体のイメージも掴みやすいと思うので。

自分のイメージなんですが、WEBデザイナーはデザインもコーディングもできる、デザイナーはデザインのみ、コーダーはコーディングのみという認識なので、WEBデザインをやる人は、デザインスキルもコーディングスキルも両方出来るようになった方が絶対強みになると思います。フリーランスの場合は特に。

ナナミ：両方できると案件の幅も広がりますよね。コーディングさせてもデザインさせてもいい、両方見られるからディレクターに据えてもいいし。

渡部：そうですよね。すごく幅広がると思います。

デザイン・コーディングの知識がある上でディレクターをやる事で、「出来る事・出来ない事、具体的な作業に関する工数感、金額感」など、実際には作業しないとしてもある程度知識として知っておかないと、提案する事も難しいのではないかなと思います。

プログラミングを学びたいWEBデザイナーの方へ

渡部さんのお話をご覧になって、

と思った方も多いのではないでしょうか？

そんな方は、侍エンジニアの無料カウンセリングにいらっしゃいませんか？

あなたの学習を効率的にするための提案や、何を学べばいいのかという相談まで、専門のコンサルタントがなんでもお話を伺います。

ぜひ、Webデザイナーからレベルアップできるサービスの詳細をごらんください。

侍エンジニアの
サービス詳細はこちら

自分の興味から生まれた別荘マッチングサービス

ナナミ：そもそも別荘のマッチングとシェアリングのサービスを作ろうと思ったきっかけはありますか？

渡部：最初は何を作り始めるか考えた時に、「そもそも何を作りたいのか？」「それは実現可能なのか？」とか全然まとまらなくて…

担当してくださった講師の方と色々話をしたんですけど、考えれば考えるほど深みにはまりそうだし、ここで時間を余分に浪費するのも嫌だったので、最初は特に勢いも大事かなと思いまして(笑)

とりあえずマッチング系のサービスを作りたいなと思ったので、それを踏まえて自分の興味・関心のあるキーワードで調べたり、今のトレンドとかも加味しながら色々なサービスを見たりして決めました。

ナナミ：そういう参考にするサービスとかってどうやって見つけるんですか？

渡部：サービスサファリっていうリリースされたばかりのサービスやアプリを紹介するサービスがあるんです。そこで今どんなサービスが随時生まれているのかっていうのを見たりして、「あっこういうサービスがあるんだ面白いな」とか、使える部分は組み込んだりとかしてました。

ナナミ：別荘というキーワードはどんな経緯で見つけたんですか？

渡部：元々はテレビでちょうど特集されていた「とかいなか」という言葉からですね。都会からも行きやすくて適度に田舎、つまり「とかい」と「いなか」で「とかいなか（とかい×いなか）」という事だと思うのですが(笑)

それを見た時に面白いなと思って。全国で空き家問題も結構目にするので同時にニーズもあるのかなと感じました。

そこから着想を得て、当初は「とかいなか」に限定して考えていたのですが、開発していく上で少しずつ考えが変わり、結果的に全国の物件・別荘にフォーカスした感じです。

ナナミ：サービスの仕組みはどうやって組み立てたんですか？

渡部：まず大きなテーマ、自分だったら物件で、マッチングで、シェアリングっていうところに落とし込んでしまって。あとはもう実際に画面構成だったり、データベース設計をエクセルか何かでワイヤーフレーム的な図として作成していった感じです。

視覚的に見ると、やっぱり「あ、こうなるんだったらこの機能必要だよね」とか、逆に「これは違和感あるからいらないな」とか必要なものが見えてきて。特にデータベースは書き出してみないと整理できなかったんですよね。

考え始めてから1,2週間くらいで構成とデータベースと静的なコーディングまでは作って、そこに肉付けしていくような形で進めていきました。

ナナミ：借りたい貸したい人のマッチング別荘シェアリングっていうテーマがしっかり決まっていたから、そうやって進められたんですね。

渡部：あとは思いついたらメモをとりまくっていました。Excelとかに「これ必要だよな」とか「あれ使おう」とか気になる情報はすべて書き込んだり。

特に開発時に、コード的に大事なポイント・流れは逐一紙に書きだして整理していました。この「紙に実際に書く」というのがとても良い情報整理になるんですよね。

ナナミ：形になった時、周りの反応っていかがでしたか？

渡部：評判は結構良かったですね。よく旅行に行く知り合いに「これいいね、本運用になったら教えてよ、使いたい」って言ってもらったり、元不動産関係の人にも「これ面白いね」と言ってもらえたりしたので。

デザインのポイントは「親しみ」と「信頼感」

ナナミ：デザインも素敵だなと思ったんですが、ずばり今回のデザインのテーマはなんですか？

渡部：ありがとうございます。

今回は「CtoCサービス（個人間取引）で、規模もそこまで大きくはないけど、ある程度しっかりとした信頼感のあるサービス」には見ていただけるようにしました。

ただ、あまりお堅い雰囲気にはしたくなかったので、がっちり作り込まず、少しフランクな雰囲気を出しつつ信頼感は崩さないっていうイメージですね。

特にCtoCは言葉で説明してもわかりづらいと思ったので、わかりやすいイラストで解説するようにしました。

ナナミ：しかも使い方解説の動画もあるんですね。ナレーションはさすが声優なだけあってクリアで聞き取りやすいです。ただの説明だけでなく動画にしようと思った理由はありますか？

渡部：単純な登録とかだけでなくサービスを利用するための流れもあるので、文字だけだと伝えづらいし、伝わりづらいなと思ったんです。

実際の利用方法と声による動画補正があれば、初見の方にもスムーズに使っていただけると思ったのが一番大きな理由ですね。

ただ、ナレーションに関してはiPhoneマイクで一発撮りなんですよ。だからアクセントとか撮り直したいところは正直いっぱいあります(笑)

でも意外と周りからは好評ですね。動画コンテンツは作って良かったと思います。

ナナミ：結構アプリの見た目、デザインで悩んでいる人多いと思うんですけど、何かコツとかってありますか？

渡部：僕がデザインを始めた時には、良いと思ったデザインを真似する事がとても勉強になるよと言われました。

とにかく色々なサイトを見て、いいなと思ったらそれを真似して実際に作ってみる。それがデザインのスキル向上には早いかなと思います。

もちろん練習として個人的にならそのまま模倣して作るのは全然良いんですが、実際に仕事ではそのまま真似したデザインを使えないので、良いなと思った構成・パーツ・装飾などを参考にしつつ自分でアレンジをして全体的なバランスを取ってあげると良いと思います。

クレジット決済やマネタイズ、作成時の苦労とは？

ナナミ：このサービスの中で、渡部さん的に「ここは注目してほしい」というこだわりポイントはありますか？

渡部：CtoCサービスとして、物件というテーマでマッチングからシェアリングまでできて、クレジットの登録・決済までできるというサービスがあまりないと思うので、そこのオリジナリティは是非見ていただき評価してほしいところですね。

ナナミ：このサイトの機能の中で、ここが一番作るのが大変だったところってありました？

渡部：結構色々詰め込んで都度大変だったんですが、一番はマネタイズとクレジットの登録・決済機能かなと。調べなければいけない事もたくさんありました。

そもそもマネタイズから考えなければいけないし、それをサービス内に落とし込んで実際にはどう実装するかなど悩む点は多かったです。

ナナミ：行き詰まったときとかはどういう風に解決したんですか

渡部：技術的に詰まった時はやはりまずは自分で調べて自分で検証ですね。それがプログラミングを習得する上で一番大事だと思います。また考え方で詰まった時は講師の方と相談しつつ都度解決という感じでした。

ナナミ：まだ未完成とのことですが、今の状態に落ち着くまでどのくらいかかりましたか？

渡部：計4ヶ月くらいですね。実際に開発でコードをゴリゴリ書いていたのは3ヶ月くらいで、後半1ヶ月は本番運用をする上での確認事や、規約とプライバシーポリシーの作成に使いました。

この規約やプライバシポリシーが結構大変で…弁護士事務所さんに見積もりを出していただいたりヒアリングも何か所かしていただいたりと、今回開発したサービスがCtoCであり扱うテーマが物件という事で、考えなければいけない事が凄く多かったです。

公開する上で、どこまでがOKでどこまでがNGなのか（サービス内容や、記載する上での表現など）を線引きした上で仮公開しています。

ナナミ：そもそも、なぜマネタイズしようと思ったんですか？

渡部：元々はマネタイズまでは想定していなかったんですけど、担当していただいた講師の方に「ここまで考えたならマネタイズまで考えてはいかがでしょう」と言われたのがきっかけですね。

マネタイズを想定する・想定しないでは考え方の面でも、スキルの面でも大きく経験値が変わるというアドバイスをいただいて、即答で「やります」と答えました。

確かに「マネタイズも含めてアプリ開発がワンストップで出来る」というのは、フリーランスとしてもかなり強みになると感じたので、これはもう即答でしたね(笑)

ナナミ：マネタイズしようとなると、やることの範囲はどのくらい変わりましたか？

渡部：マネタイズならではのキャッチアップというか調べなきゃいけないことは結構たくさんありましたね。

決済サービス部分でいえば、PayPal（ペイパル）や、Stripe（ストライプ）など代表的なものが色々あると思うんですが、当然サービスによって特色や、利用料金もかなり違うので、それも調べつつ実際にそれを実装しようとした時に現在の設計にどう組み込むか等色々考えました。

あとやはりマネタイズすると当然「お金のやり取り」が発生します。その点も含めて弁護士さんにご相談する事が多かったのですが大変でしたね。弁護士事務所さんの中でも、無料で初回ヒアリングしてくださる所はそこそこあったので利用させていただきました。

限られたヒアリング時間をムダにしない為に、あらかじめ自分の聞きたい項目は箇条書きでまとめておいて、なおかつその中でも「絶対に確認しなければならない事」「時間があれば聞きたい事」など優先順位を決めて行ったので、色々伺えて助かりましたね。

何社かヒアリングをしていただいた上で再度サービスを見直し・改修しました。おかげで法的にも問題ないと判断できる規約・プライバシーポリシーに仕上げられたと思います。

「ゆくゆくはきちんとサービス運営していきたい」

ナナミ：いまはテストという形での公開ですが、最終的にサービスとしてしっかり公開する予定はありますか？

渡部：やはりマネタイズまでしっかり考えてあるので、最終的にはサービスとして運営していきたいとは思っています。今は一部の機能を制限した状態にしてあるので、その制限を外して改修すれば本運用できる状態になります。

しかしそこまでもっていこうとすると、サービステーマの性質上、弁護士さんと顧問契約で年間を通してアドバイザーになっていただく必要があるとも考えていて、弁護士費用、改修するための時間もある程度必要になってくるので…本運用にする時期は現在検討しています。

ナナミ：新しいアプリの構想はありますか？

渡部：はい、あります。求人系のサービスや、今回とは違う技術系のマッチングアプリなどにも関心があるので、今後開発したいと考えています。

実は現時点でデータベース設計・構成まで終わっているものもあります(笑)

他のどんなスキルもそうですが、プログラミングも使わないとどんどん忘れてしまうと思うので、エンジニアとして実務はもちろん、個人的にも積極的にサービスを開発していければと思っています。

ナナミ：そうやってどんどんアイデアが出てくるのがすごいですね。アイデア出しのコツとかってあるんですか？

渡部：アイデア出しは、少しでも自分の興味・関心があるキーワードから考えるのがいいと思います。

トレンドだからまったく関心ないテーマだけどやってみようと考えるよりは、少しでも関心があるテーマをやってみてはいかがかなと。関心がないテーマを選んでしまうと結局モチベーションが保てなくなってしまうと思います。

あとは既存のサービスから考えるとかでしょうか。

例えばインスタグラムは「ツイッター」に「画像投稿に特化した機能」を独自性として組み込んだサービスだと考えられますよね。

そうやって既存のサービスと自分の関心のあるキーワードを組み合わせる感じにすれば、比較的アイデアが出やすいのかなと思います。

ナナミ：最後に、これからプログラミングを学習しようと思っている方にアドバイスをお願いします！

渡部：自分でオリジナルのサービスを0から開発したいという方は、【開発途中でどんなエラーに遭遇しても自分で検証・解決していく力】というのが一番重要だと思います。

最初は「本」や「オンライン学習サービス」を選ばれる方が多いのではないかと思うのですが、恐らくこれらではこの力を身に着ける事は難しいのではないかと思います。「キット・マニュアルの様なものが用意されていて、決められている流れを順番通りに進めていくだけ」という感じなので。

凄くリーズナブルでありメリットも多々あるとは思いますし、もちろん個人差があるので必ずしもムリという訳ではないとは思うのですが…自分としては【想定されているエラーにしか遭遇しない】というのが一番危惧する問題でした。

そこで自分はプログラムスクールの中でも「侍エンジニア」を選択しました。

一番大きな要素はやはり侍独自のカリキュラムである「完全オーダーメイド（自分のやりたい事が思う存分出来る）」これは他社にはない侍独自の強みだと思います。他スクールでは「カリキュラムが1～10まで決まっていて、それ以外の事は教えられない」というスタイルが意外に多くて調べていてがっかりした記憶があるので…

もちろん本人が「何をやりたいか？どんな目標があるか？」によってスクール選びの基準は変わってくるので何処が良い、何処が悪いとひとえには言えないのですが、もしスクールという選択肢を考えるとすれば、スクール選びは非常に重要です。

プログラミング学習には相応の学習時間や、もしスクールに通うとすれば相応のお金がかかったりしますが、やる価値は十二分にあると思います。

おそらくものすごく悩んで、エラーも数えきれないほど遭遇すると思いますが、自分で手を動かして解決した分だけ自分の血肉になることは確実なので、関心があれば是非挑戦していただきたいです。

---

アプリのアイデア出しだけでなく、自分のサービスとしてマネタイズするときにどんなことが必要になるのか、今までにないお話をたくさん伺えた素敵なインタビューでした。

渡部さん、ありがとうございました！

オンラインでどこでもコンサルタントに話を聞ける無料学習相談

リモートワークなど多種多様な働き方ができるITエンジニアを目指しませんか？

未経験でもご安心ください。無料学習相談をご利用される9割の方はプログラミング未経験です。まずは無料カウンセリングで、プロのコンサルタントにあなたの悩みや不安をお聞かせください。

なお、侍エンジニアでは次のような割引・特典もご用しているため、通常よりもお得な費用で受講いただけます。

リスキリングを通じたキャリアアップ支援事業補助金	受講料の最大70%(上限56万円)の支給が受けられる
全額返金保証制度	転職活動で内定が獲得できなければ受講料を全額返金
学割	通常の受講料から10%OFFで受講可能
一般教育訓練給付金制度	コース受講料の最大20%(10万円)が給付金として支給される
小中高生向け優待プログラム	小/中/高校生は25%OFFで受講可能(全コース)
女性向け優待プログラム	女性の方は5%OFF/シングルマザーの方は25%OFFで受講可能(全コース)
障がい者向け優待プログラム	障がいをお持ちの方は25%OFFで受講可能(全コース)
シニア向け特別プログラム	50歳以上の方は10%OFFで受講可能(全コース)

無料カウンセリングは、下記のカレンダーから簡単にご予約いただけます。プログラミング学習に関する悩みや疑問、キャリアの相談などございましたら、気軽にご予約ください。