プロダクト開発について

技術で文化を変える

GitHubでソースコードを共有し
Figmaでブラウザ上でデザイン設計を行うなど
オンラインコラボレーションやコミュニケーションが定着し
コモディティ化したのは、ここ10数年ほどのことです。

コードのPatchを、メールやIRCで送信後に確認を求めたり
デザインはファイルによるバージョン管理でした。
これが当時では、当たり前の開発環境でした。
しかし、技術の発展による革新的なサービスの誕生により
開発環境や開発フローの常識が変わりました。

昨日までの「当たり前」を変える変化を
私たちの手で生み出し、アップデートし続ける。

技術で文化を変える

これが私たち、プロダクト開発チームが掲げるミッションです。

Culture 開発カルチャー

動くものを先に作る
フロー効率を意識し、「プロダクトの仮説検証サイクル」を高速に回すためのバックログ管理を欠かしません。社内デモ会やお客様フィードバックを開発サイクルに取り入れ、価値提供を中心としたプロダクト開発を進めます。
開発力の係数を高める
目先のタスクに追われると中長期的な仕組みづくりやリファクタリングは後回しにされがちです。 CI/CDの積極的な整備、機能レベルでのDesign Docドリブンな開発を意識し、チーム全体のパフォーマンスを最大化します。
コミュケーションを武器にする
GitHubのコメントやSlackのメッセージなど多くがテキスト情報として存在します。また、ハドルによる「オンラインの通りがかり」もやりやすい環境が整ってきています。フルリモート開発では、コミュニケーションの同期性・非同期性を意識することで「正確かつ高速な開発」を進めることが重要です。

Development Environment 開発環境

フルリモートワーク
nocoのプロダクト開発部は、オフィス出社不要のフルリモートワークによる勤務体系を採用。
同時に、コミュニケーションの同期性・非同期性を担保するため、Google MeetやSlackハドルなどオンラインでの積極的なコミュニケーションを推進しています。また、開発者の業務効率と生産性向上を目的として、外付けモニターやワイヤレスヘッドフォンなど、ご自宅での開発環境の整備を支援しています。
DFTの推進
「ピープルウェア」で提唱されている、開発者が開発に集中するための時間を確保できるように、DFT（Development Focus Time）を採用。
たとえば、定例ミーティングは午前中に集約し、効率的で高品質なコードの開発やまとまった時間でクリエティブ制作に集中できる時間を設計しています。一方で、オンライン雑談が起こりやすいコミュニケーション設計により、自然と会話が生まれる環境を整備しています。
GitHub Copilot 全員配布
GitHub社が提供する「GitHub Copilot for Business 」を開発者全員に導入し、プルリクエストの作成をはじめ、既存コードの解析や改善提案に活用しています。AIが一連の開発業務をサポートすることで、開発者の生産性向上やメンタルストレスの低減し、パフォーマンスの最大化をサポートしています。
AIテクノロジーを開発する私たちがAIのベネフィットを感じることが大切だと考え、今後も様々なAIツールを積極的に採用していきます。
CI/CDファースト
属人性やトイルの削減のために、開発フローの自動化に積極的に取り組んでいます。
新しく開発ガイドラインを作りたいときは、まず最初に「それはCIでチェックできるのか？」を第一に考え、そのための実装コストや将来のメンテナンス性を考慮して整備を進めます。
現場主導のツール採用主義
トップダウンではなく、開発メンバーからの提唱によりChromatic、Vercel、Cloudflare、Astroなど、サービス・開発ツールを積極的に導入しています。
開発業務の生産性や効率化を目的に、検証・展開・導入評価をスピーディに行い、採択することで、プロダクト開発の根幹となる「価値創造」により多くの時間を割ける環境をつくり、事業に貢献しています。
認知負荷の削減
読みやすく理解しやすい技術文書を残すことで、短期的な意思決定と長期的な振り返りを継続的に取り組んでいます。
また、日々のコードレビューにおいても、技術的な指摘だけでなく、「他の開発者が意図を理解できるか」という点においても意識するようにしています。

Development cycle プロダクト開発の進め方

開発スプリントの流れ

開発サイクルは「2週間のスプリント」を基準としたスクラム開発をおこなっています。

「Dev Sync」について

毎週金曜日の夕方に開催している開発勉強会です。さまざまなトピックに対して、開発者のスキルアップを目的として開催しています。

「Dev Sync」の具体例

Quick Hacks: 1時間で全員参加のプチハッカソン

技術選定 レビュー会: 大きな意思決定をみんなでやる

なんでも モブプロ: ネタ持ち込みでコーディング

開発フロー

nocoの開発フローで特徴的な点は、開発に着手する前にFigmaでリリースを想定したモックアップを作るところにあります。

最初に、プロダクトオーナーやプロダクトマネージャー、場合によっては機能提案のある開発者がデザイナーと一緒に「リリースレベルのUI」を作ります。この段階で、顧客やビジネスチームを含めて、期待する効果が得られそうか検証します。この検証フェイズを突破した案件は、開発チームに引き渡され、スクラム開発によってバックログに組み込まれます。

80%程度の完成度になると、ビジネス部門を対象にしたプレゼンテーション「ビジネスデモ会」を行い、UXが意図したものになっているか、みんなでレビューします。その後、必要に応じて修正し、QAを行ったものが都度リリースフローに入ります。

リリース後はKPIをチェックし、想定とのギャップを計測します。また、顧客からのフィードバックを受けて、再修正、または新しい案件としてサイクルが回ります。

技術スタック、使用ツール

フロントエンド: TypeScript、React（Server Componentsあり）、Next.js（App Router）、Storybook、OpenAPI＋Orval、TanStack Query、MUI、Tailwind、shadcn/ui

バックエンド: Ruby on Rails（API mode）

インフラ: AWS（ECS、Lambda、S3など）、Cloudflare

プロビジョニング: Terraform

検索・AI: Algolia、ChatGPT

決済: Stripe

モニタリング: Sentry

DB: PostgreSQL

CI/CD: GitHub Actions

プロジェクト管理: GitHub

UI デザイン: Figma

コミュニケーション: Slack、Notion、FigJam、Google Sheets

その他業務ツール: Google Workspace、1Password

Challenges 私たちのチャレンジ

AIをシステムに落とし込む
AIはその応答性や正確さの特性から、今までとは全く異なるUXが要求されます。いままでにない発想で、使いやすいUXを検討しながら模索していく必要があります。
その結果、「AIをつかったUXのデファクトスタンダード」を作りたいと考えています。
世界中のトラフィックを捌く
私たちが現在開発しているヘルプドッグは、最初から世界展開を目指しています。
そのために必要なエッジインフラや多言語対応、Core WebVitalsやアクセシビリティ対応など、最新の技術をつかって取り組むべき課題が存在します。
型の恩恵を受ける
私たちは、数年前からフロントエンドのTypeScript化を進めており、技術スタックの更新が完了しました。バックエンドにおいても、現在はRubyで書かれていますが、型安全な方式を模索しています。
より安全で効率の良い仕組みを設計し、実装していく必要があります。

Skills 求めるもの

職種共通: CI/CD の重要性理解; ChatGPTや話題の新ツールなどをキャッチアップし、常に検証しチームへの導入を検討できる貪欲さ

ソフトスキル: 読み手の認知負荷の少ない技術文書作成能力; 使いやすさを意識したプロダクト設計への参画意欲; 異職種メンバーとのコミュニケーション能力

人物像: コミュニケーションはチーム開発で最重要であると同時にコストであると認識し、効率的なプロダクト開発のためにはそれを改善し続けないといけないと考えるひと; 新しい技術をキャッチアップするだけでなく、実際に業務に活かしたいと思うひと; 問題の根本原因を理解してから解決したいひと; 既存の文献・ホワイトペーパー・論文などをキャッチアップし、守破離を意識して設計できるひと; 経験主義に立脚した高速な試行錯誤に興味あるひと