ホーム
プロフィール
考え方
制作物
お問い合わせ

Design Shittoco

Chakra UI
Next.js
個人制作

見どころ

  • ヘッドレスCMSにAIrtableを使って簡単運用
  • Next.jsのISRを使って即時反映
  • ログインなしでユーザーのお気に入りサイトを可視化
  • ユーザーの行動を設計してコンバージョンをGAで計測できるように開発

なぜ作ったか

自分が登録しているブックマーク集が散らかってきたのがずっと気になっており、整理されたものがほしいなと思っていたのでReact/Next.jsの習作にと思い作成しました。

開発上の技術スタック

下記のようなかんじで、自分の使い慣れたものを中心に選んでいます。

作る上で力を入れたところ

普段は個人開発のアプリは勢いで作る事が多いのですが、今回は、普段の業務っぽくユーザーの行動を考えた上で画面を作成しました。

理由としては、開発したサイトが最近作り放しが多く、改善施策のモチベーション低下があると自覚をしており、ユーザーを想定してきちんと向き合うことで改善モチベーションを維持できないかというところからです。

機能の追加などでできる改善も多数ありますが、導線や文言など軽微な修正が良い改善になることも多く、そういった改善はユーザーと向き合っていないと良い仮設を持つのが難しいと個々最近感じています。

そのためシンプルなサイトではあるもののファンになってくれたユーザーの行動の仮設も考えて開発をしています。

またユーザーと向き合うのも大事な一方で自分がどうしたいのかも合わせて考えました。
これは自分がしたいことと、ユーザーがしたいことが悪い干渉を起こしていないかを気が付きやすくするためです。

プロダクト開発をする上で「改善」と一言で言ってもユーザーのための改善ではなく、サービス提供者(開発者)のために改善しているケースもあり、誰のための「改善」をしているのか意識するのに役立っています。

KPIを設けてよかったところ

GoogleAnalyticsのイベント計測でユーザーの行動を数字に落とせるようにできました。

GoogleAnalyticsが新しいバージョン(GA4)に変わり計測方針がページからユーザーに変わったので、1ユーザーあたりの平均イベントなども計測しやすくなっており、サイトのヘルススコアの管理ができるようになりました。

以前からこういった施策をやってみたかったのですが、なかなか重い腰が挙げられなかったので、今後の改善が楽しみになっています。

UXのこだわりどころ

今回Vercelを使いサーバー側をISRにしており、APIの更新があった場合は最新の情報がユーザーに提供されるようになっています。

このサイトでは、ユーザーがLIKEのリアクションをとってお気に入りサイトにポイントを付与できるようになっていますので、静的サイト(SSG)では更新タイミングが遅れるところを回避しています。

最後に

運用も改善もしやすい土台を整えたと自負しているので、当初決めた事を実現できるように励んでいくつもりです。

その他の制作物

他にも制作したものはありますので良かったらご覧ください。


バズったサイト
バズったサイト
当時SNSでバズっていた「旦那デスノート」というサイトを見て、その真逆のコンセプトで「俺の嫁が可愛い」というサイトを3時間で制作。 公開初日で10万PV、その他yahooニュースなど大手メディアにも紹介されました。
家庭内タスク共有アプリ
家庭内タスク共有アプリ
SNSで家事・育児の認識の齟齬が話題になっていたため、解決手段としてWebアプリを思いつきオリジナルで作成 ユーザー自身も認知していない解決手段を提示できたようで、多くの方から称賛の声をいただきました。
JAMStac構成のサイト構築
JAMStac構成のサイト構築
Nuxt.js,Prismic,NetlifyのJAMStacで作ったサイトです。 100ページを超えるサイト管理をHeadlessCMSのPrismicで管理ができています。
ご褒美付きタスク管理アプリ
ご褒美付きタスク管理アプリ
自分が決めたご褒美で至福の時間を楽しむ自分で自分を甘やかすアプリ。 タスクをビンゴ形式に当てはめてタスクを楽しんで処理できるアイデアをionicで実現。
技術ブログ
技術ブログ
9年続けてきたブログ。 2016年からは月4記事を書く事を目標に継続 継続することでSEOやライティングの能力を鍛えました。
コーポレートサイトコーディング
コーポレートサイトコーディング
都市経営プロフェッショナルスクールのWebサイト 副業で依頼を受けフロントエンドを担当(デザインは別の方が担当)