/Idea-memory

アイデア出しをサポートするWebサービス「Imemo」(アイメモ)

Primary LanguageRuby

スクリーンショット 2024-02-19 20 05 13

このサービスについて

「アイデア出しをもっとスムーズに」
という思いがあり、このサービスを製作しました。
Idea Memory (Imemo)とは、アイデア出しをサポートするWebサービスです。
主な機能として、マンダラートを作成することができます(他の機能も随時追加して行きます)。
自分のマンダラートを作成・保存・pdfでPCに保存できます。
気軽に体験してもらえるために、トップページでもマンダラートを作成できるようにしました。ぜひ使ってみてください。

作成の背景

現在大学生で、インターンやハッカソンで、アイデアを出すのにすごく時間がかかってしまうため、スムーズにアイデアが出せるWebサービスを作りたいという思いがありました。
また、インターンの研修でマンダラートを用いたアイデア出しを行い、簡単にアイデアが出せたが、みんなが共通で思っていた不便な点がいくつかあり、それを改善しようとしたのが、きっかけでした。

  • 紙と鉛筆で書くのは、正直面倒
  • **のマスに書いたことを、外側のマスに書かないといけない → めっちゃめんどくさい
  • 全てのマスを埋められない泣
  • 共同で作業をしたい
  • 他の人のマンダラートを参考にして、自分のを描きたい

これらの問題をWebサービスで解決できたら、いいサービスになるのではないかと考え、まずはインターンで使用したマンダラートをWebで作成してみることにしました。 最終的には、他のアイデア出しの手法も導入できたらいいと考えています(ジョハリの窓やオズボーンのチェックリストなど)。

* ちょうど就活の時期なので、マンダラートで自己分析をして、面接官に「自分が作ったサービスで自己分析しました」と言えば、ウケるのではないかと考えた。

使用用途

  • 開発のアイデア出し
  • 就活の自己分析
  • 目標決め(大谷翔平選手もマンダラートで目標決めをしていたそう)

サービスの機能一覧

マンダラートを作成・保存できる

Imemo pdf

工夫した点

pdf保存機能のデザイン設定

作成したマンダラートをpdfで保存できるようにしました。
また保存するときに、マンダラートとロゴのみをpdf保存できるように(右上の画像)Webサービス側とpdf保存する側でデザインを変えて実装しました。

おまけ

Imemo pdf

このサービスでアイデアがたくさん出せることを願って、ソースコードに「!」を大量に仕込んでおきました(笑)

課題

ユーザー側の課題

  • 紙と鉛筆で書くのは、正直面倒
    → Webサービスにしてデジタル化する。
  • **のマスに書いたことを、外側のマスに書かないといけない
    → 自動入力機能を作成。同じことを書くマスを片方書くと、もう片方のマスに反映されるようにした。
  • マンダラートを紙で持っていきたい
    → pdf保存機能を作成。PCにマンダラートのpdfを保存できるようなボタンを作った。
  • 全てのマスを埋められない
    → 周りのマスの情報から、AIを使って単語を埋めようと思う。
  • 共同で作業をしたい
    → 共同作業できるようにリアルタイムで通信できるようにする→具体的な方法はまだわからない

技術的な課題

  • マンダラートを読み込むとき、変更を保存するときに重くなる
    → チューニングをして、スムーズに値が取れるようにする
  • なんかサイトが全体的に重い
  • SQL文の見直し
    → N+1問題を起こす命令の確認
    LB, APP, DBサーバー間のネットワーク環境の確認/nginxやApacheなどのサーバーソフトウェアの設定値等の確認/SQL文の見直し(N+1問題を引く起こすクエリはないかなど)

ほかのサービスとの差別化

  • マンダラートを作成できるWebサイトがあったが、全部入力しないときれいなマンダラートを作れないことやログイン機能がないことが問題だった。
    → 最初から81個のマスを用意し、それを表示 & ログイン機能を作成
  • そもそもマスが小さすぎて、スマホでの作業に向いていない
    → スマホを横にして作業ができるようにデザインを工夫した。

サービスのデザイン


Untitled (10)

ユーザーのマンダラートの例

研究室の同期が作成したマンダラート
Imemo pdf