芋出し画像

👚‍⚕👚‍💻医孊生がノヌ知識週間でオンラむン教垫をマッチングするアプリを䜜った話

むコラ


自己玹介


こんにちは。

フォトグラファヌの”ikora”です。

珟圹医倧生で、その他よく分からんこずを色々しおいる人間です。




本題

👚‍⚕👚‍💻医孊生がノヌ知識週間でオンラむン教垫をマッチングするアプリを䜜りたした。


こちらがそのサむトWebアプリです。
珟圚、β版です。い぀でもリリヌスできる状態ですが。

サヌビス名Search-Sensei
サヌビス内容オンラむン教垫を探すこずができる。先生登録もサむト䞊で行え、カヌド決枈Stripeで受講料を払うシステム。


䞻な機胜はこんな感じ。

スクリヌンショット 2020-07-04 23.27.40

・サヌチ機胜
・メッセヌゞング機胜
・スケゞュヌリング機胜
・オンラむン決枈

などなどです。

流れずしおは
ナヌザヌが気になる講座を怜玢しお、申し蟌む
先生ずスケゞュヌリングする
カヌド決枈
Zoom等でオンラむン授業
な感じです。

画像7

ホヌムペヌゞのデザむンはリンクから芋おもらうずしお、䞭身はこんな感じです。スマホアプリを意識しおたす。


画像7

メッセヌゞング機胜はこんな感じ
デザむンやロゎ䜜成ももちろん党郚自分でやっおいたす。
faviconはこれ。

ロゎ透過

"Se"arch-"Se"nseiの「Se」を念頭に
"S"の文字に瞊線を入れるこずで"e"も衚珟するずいう意匠です。

䞋の方に、90床回転された「e」の文字が芋えたすでしょうか。
あずラむティング意識しお、色ず圱の付け方を少し工倫しおいたす。


䜿甚ツヌル


泣く子も黙る「Bubble」です。

近頃、かなり話題になっおきおいるNoCodeツヌルの䞀角ですね。


ちなみにnoteだずこんな有名な蚘事が。

芁するに、週間ノヌ知識でアプリが䜜れるのがこのNoCodeツヌルの凄さです。

以䞊、この蚘事で特に蚀うこずはないです笑

NoCodeずいう、コヌドを曞かずにアプリを䜜れちゃうサヌビスですね。
今たではペラむチシングル・ランディングペヌゞなWebサむトを䜜るのに様々なサヌビスが有りたしたが、所謂NoCode矀はサヌビス・アプリたで䜜れちゃうずいう感じ。


倧分県お゙䞀番分かりやすい家庭教垫【OMsT_倧分医倧生家庭教垫グルヌプ】

ただセンセヌショナルな単語で特に定矩はなく、WordPressもNoCode的な立ち䜍眮だず理解しおも良さそう。(䞊蚘は私が運営しおいるWordpress補の家庭教垫玹介サむト)


Bubbleは䞊蚘のしんじさんの解説動画ず、同じくNoCodeの解説蚘事を出しおいるノヌコヌドラボさんを結構参考にしたした。


他はBubbleの公匏チュヌトリアルだったり、䞋蚘Bubble Forumがめちゃくちゃ参考になりたす。だいたい分からないこずの倧半はここで解決したした。

それでもわからないずきは自分も質問しおいたした。
英語がめちゃくちゃ苊じゃなければ、最短ルヌトな気がしたす。


初めおだったので週間もかかっちゃいたしたが、次同じようなものを䜜るずきは週間皋床で終わるず思いたす。

もちろんNoCodeなので䞇胜ではないですが、シンプルめなCRUDアプリならちゃちゃっず完成できるでしょう。



制䜜過皋

元々、完成圢が決たっおるわけではなく、「なんずなく觊っおみるか」な気持ちだったので、随分迷走気味ですが。

〜日目
アプリに぀いお考えながらBubbleに぀いおチュヌトリアル動画で勉匷。

先皋も玹介したしたが、䜓系的に孊ぶのならこの方の動画が䞀番いいです。ぶっちゃけ英語圏含めおも䞀番たずたっおる動画だず思いたす

あず公匏チュヌトリアルはちゃんずやっおおいたほうがいいです。
最初は慣れないかず思いたすが、ちゃんず順序立おお教えおくれるので。


〜日目
ガリガリず実装しおいく。

もう家に垰ったらひたすらBubble挬けの日々でした。
勉匷はある皋床孊校で枈たせたり。

手術芋孊で時〜18時立ちっぱなしのずきずか、家垰っお寝そうになりながらも、い぀ものお酒を控えおそれはもうガリガリず。

途䞭でいっぱい問題が芋぀かっお、その床にBubble forumで調べおは解決の繰り返しでした。

画像5

倧奜きな写真も、梅雚時期であたりするこずがなく閑散期だったのでずいうかそれ以前にコロナで䟝頌が激枛それもBubbleに打ち蟌む芁因の䞀぀でしたね。

この写真はたたたた梅雚の間に晎れたので、垰り道に撮った棚田です。
なっかなか田舎の堎所に孊校あるんだなぁ笑


8〜11日目
このあたりからビゞュアルを敎えるのず、ログむンペヌゞなどの実装を始める。现かい修正や、必芁なペヌゞを増やす䜜業が倚く䞀番頭抱えた気がする。

普通にWebサむト䜜るずきは、レスポンシブデザむンしたすよね
Bubbleでもレスポンシブがちょっず倉わった方法で蚭定できるのです。

ただ、これが案倖厄介で良い資料も芋぀からずに頭を抱えたした。

結論から蚀うず
「スマホがメむンなら、スマホサむズでデザむンしおパ゜コンサむズはそこから拡倧する。」
のがベストプラクティスだず感じたした。

ロゎ透過ver

䞀般的には、パ゜コンでデザむンしお、その埌スマホに察応しおいくスタむルがですが、Bubbleでは逆にスマホデザむンを優先しお拡倧しおいくのがやりやすいように思えたした。

画像7

もちろんランディングペヌゞなどは通垞のレスポンシブ察応でいいず思いたす。

特に他にBubbleで䜜られたサむトで気になるのが、レスポンシブずいうか画像の瞊暪比ずか、芁玠の長さが極端に長いなどのビゞュアルが詰めれおないのが散芋されたした。


12〜14日目
ほがほが完成。土日でかなり詰めた感じ。
特にStripe・独自ドメむン・SendGridの蚭定でかなり時間を飛ばした。

䞊蚘は蚭定しおからの時間差もあるずいうこずで、せっかちなのが原因で逆に時間かかっおしたうこずが倚かったです。

ここらぞんはマゞのマゞでちゃヌんず、公匏リファレンス読むべしです。
「読んだら曞いおあるやん」なこず倚しです。
ただし、䞀個でも飛ばすずドツボにはたるずいう萜ずし穎付き


所感

以䞊、私のBubble䜓隓蚘でした。

たぁ週間なので随分荒削りなずこはありたすけど、自分的には週間しっかり䜜りきったなずいう感じです。

ダりンロヌド (1)

今もちょいちょい勉匷がおら觊っおいるのですが、次はテむクアりトをオンラむンで頌めるアプリでも䜜ろうかなず画策しおいたす。


NoCode、䞇胜ではないのは癟も承知ですが、しかしかなりできるこずが倚いず感じたした。䞀人でほずんど完結するのも面癜いですね。

個人的には、NoCodeずいう蚀い方よりVisual Programmingのほうがいいかなず思いたすが、NoCodeずいう蚀葉の魔力もやはりありたすよね・・。


NoCodeで先に、垂堎の怜蚌・業務のリハヌサル・資金集めをしお、䞊手く行けば本栌的に制䜜に取り掛かるのもアリなのかなぁず感じたした。


最埌に

宣䌝です

このコロナが収束したら、ぜひ倧分県に遊びに来おください

以䞊



この蚘事が気に入ったらサポヌトをしおみたせんか