俺

スペース

チームの仕事を計画し、ディスカッションを行い、ソフトウェアプロジェクトを開発するのに役立つツールを備えたチーム作業のためのプラットフォーム

Spaceロゴが表すように、それはGit、Chats、Team Directory、Issue trackerの交差点です

責任と

タイムライン

製品を立ち上げ、市場に投入できる状態にするために、概念開発の初期段階から参加しました。主要なマイルストーンを含むタイムラインを探索します。

2人のデザイナー

20
18

JetBrains内部での採用

• Gitホスティング
• チームディレクトリー
• コードレビュー
• カレンダー
• ブログ
• iOSアプリ

4人のデザイナー

20
19

Kotlin Confでの発表

• 受信箱 → チャット
• Androidアプリ
• CI/CD
• ダッシュボード
• チェックリスト

デザイン管理

デザイナーチームの管理、彼らの成長を支援し、批評セッションを促進

プロダクトマネジメント

ダッシュボード、検索、オンボーディング、エントリーポイント、ToDoリスト、ナビゲーション

マーケティングコミュニケーション

ビジュアルコミュニケーション、Spaceウェブサイトを含む、も私の責任範囲に含まれます。

UX ソリューションの詳細

よく設計された課題トラッカー、Git ホスティング、およびチャットは既に存在しています。ただし、これらのアプリはしばしば互いに切り離されています。Space UX の目標は、シームレスさを導入することです。

解決策のブレイクダウン

軒並み ここ、オールイン1

 

一歩一歩ビジュアルデザイン

まもなく

iOSで外出先で

軒並み

すべてを統合するアプリケーション

現状

開発ツールは通常、絡み合っているか、一つのセットに組み合わせられています...

...一方で、タスク追跡、チャット、共有ツールは開発と互いに独立して分離しています

ここでどのように Spaceがツールの分離を解決するかを見てみましょう 💥

スペースの歴史

反復

001

002

003

004

005

001

Alphaバージョンはリポジトリと友達に焦点を当てていました。まだSpaceではありません

• VCS, コードレビュー, チームディレクトリー, ブログ

002

初期のカスタマイズフローには⭐スターズが使用されました。お気に入りのプロジェクトがナビゲーションバーに表示されます

• 問題追跡, 自動化, チャット

003

あなたのアバターが最初の場所 = あなたのSpace。ピン留めされたエンティティに対して強力なウィジェットを使用します

• To-Do, 在席状況, パッケージ, ボード

リッチウィジェットのMVPを作成するために、私たちはボックスのサイズが使用率を表す採用チャートを見ました。最も使用されている機能が最初に新しいデザインを受け取りました。

1プロジェクト

2-10プロジェクト

10+プロジェクト

003 から 004 へ進むために、私たちは組織ごとのプロジェクトの分布を見て、UIを1つのプロジェクトに焦点を当てつつ、スケール可能であるように設計しました

004

より少ない軸、プロジェクトの作業に焦点を当てる。ウィジェットが人気になっています。管理者は今全員のためにウィジェットをピン留めできます、新しいプロジェクトへの簡単なオンボーディング

• ドキュメント, プラグイン, リモート開発, 時間トラッキングとレポート, 展開

005

メインのナビゲーションバーをさらに簡素化し、レイアウトはサイドバーの幅に応じて適応します。

• 補足的なアクションを持つフローティングツールバーは、メインのナビゲーションフローからはもう邪魔になりません。

006, 007...

それは継続的な旅です！

ゼンモードは常にPRO向けのソフトウェアの一部でした。Spaceも例外ではありません。情報密度は柔軟性を必要とします。

折りたたみモードは追加の画面スペースへのアクセスを提供します

スペース・ビジュアル・スタイル

空間 (くうかん) space

全サブチーム

空間 パーカーのバックプリント

スペースのモックアップで、あるキャラクターが大きくフィーチャーされていることにお気づきかもしれません。

🔊 宇宙さくらチャイム、スペースコールズ実験用オリジナルメロディ曲

可用性ステータス

スペース・アナウンスが行われたKotlin Conf 19のJetBrainsブース用ポスター/Tシャツデザイン

チームの集まりのためにデザインされたキータグ

パーソナル・ダッシュボード

フリートでコードを書く

この新しいコードエディターについては何ですか？

何百万人もの開発者に愛されて使われているIntelliJ IDEAからUXを取り入れる…

…必要最低限に集中し、事前設定なしで動作するようにする…

 

…市場のオファーとは異なる独特のビジュアルスタイルで味付けをする…

…そして、それによって新しいコードエディターを作成する

正確でクリスプなもののアイデアは、タイポグラフィやロゴなどの他のビジュアル要素にも影響を与えます。

主な参照である1980年代のパーソナルコンピュータ革命の時代やワールドワイドウェブの初期の日々を考えると、UIのさまざまな要素も同様の雰囲気になりました

初期段階でも、私たちは一貫性と複雑なシナリオについて考えていました…

…デバッグ、リモート開発、ワークスペースなどです。 簡単さが拡張性を保証するのは不可欠でした

Fleet内部でのコードのレビューとgit chunksのスタイル

チーム（私も含め）はこのアプリを作るのが非常に楽しかったので、初期段階の終了を記念してスワグを作りました

（古い）学校にはちょっとかっこよすぎ

でもスカーフにはちょうどいい

Fleetでアプリを作るのが楽しいことを願っています。

作業方法

デザイナーやプロダクトマネージャー向けのノート。製品仕事を効率よく進めるためのアプローチと避けるべきことについての指導。

Kri Danilinaと私はこのプロセスをガイドするためのコミックをデザインしました。喜びましょう！

ユーザージャーニーの概要

商品の発見

常に製品のスクワッドを形成します。 QA, PM, デザイナー, 開発者, マーケティング担当者。意見の平等な重みを促進します。

市場を探求し、初期のビジョンとビジネス戦略を確立します。商品 + マーケティング = 🤍

ローンチ前は、製品分析よりも顧客インタビューや初期のプロトタイプ、MVPを優先します。

ユーザージャーニーと解決された痛み点を説明します。機能に焦点を当てるのではなく、結果を定義します。ユーザージャーニーを製品のロードマップの方向にマッピングし、優先順位をつけます。

可能であればコミュニティを確立し、量的なフィードバックを集めます。

プレデザイン

ピクセルより前

あなたの時間と仲間の時間を尊重します。会議やデザイン/製品の文書作成を開始するだけです。形式化の必要はありません。

時間を節約するために、いくつかの課題はチームメイトと話すだけで解決できます。形式化しないで；想像以上に手の届く果実があります。

目標はユーザーエクスペリエンスを改善することです。モックアップ、UX研究、デザインシステムへのコミット - これらはツールです。

初期設計

既存のパターンとUIを再利用することは、効率的なコードベースを維持するのに役立ちます == 🤍エンジニアリングチームから

OSガイドラインを最新の状態に保ち、プラットフォーム固有のUX（例えば、キーボードのインタラクション）を考慮します。初期段階でアクセシビリティを含めることを試みます。十分なコントラスト、スクリーンリーダーのサポート。

ローカライゼーションと拡張性は、アプリが拡張可能でなく、壊れやすいまでそれらを追加するのが痛いまで通常は省略されます。

チームメイトと共に

期待を管理します。大まかな見積もりを提供し、定期的にクロスファンクションチームと面会します。

非同期の知識共有に貢献します。例えば、Figmaやチケットへのリンクを含む数行、毎週金曜日。人々は何を再利用するかを知るでしょう。

デザインデモは1つのユーザージャーニーに焦点を当てた短いピッチです。プロダクトチームが議論に参加するためのプラットフォームを作るためのツールです。

非同期モード（ミーティング無し）で議論を開始します。ボイスオーバー付きのビデオを録画し、チャンネルに投稿します。

可能な限り大きなグループにプレゼンテーションをします。すなわち、投稿を作成し、デイリースタンダップでそれを発表します。

簡潔な情報を評価します。すぐにポイントに到達し、集中します。

我々が裁く方法_(そしてその根底の問題）は、既存の戦略的イニシアチブにどのようにマッピングするかを強調します。

達成の定義 (DoD)

_デザインデモの段階の後で、_デザイナーまたはプロダクトマネージャーは達成の定義を含むタスクを準備し、それをバックログに移します。

DoDs セクションは、ユーザージャーニーの達成に必要な機能的で中心的な視覚変更を正確に説明します。

ピクセル完璧に磨き上げることに焦点を当てることを避けます。新しいものがどんなに小さくても、UIをコンポーネントライブラリに基づいて作成します。

常にデモを進める前、そしてチケットを開発チームに手渡す前に一度だけ、UXライターと協力して文言を確認します。

学ぶ機会を逃さないでください。どの指標を測定し、何を追跡するかを決定します。製品の洞察があなたを待っています。

ここで、優先順位がつけられます。それほど焦点を定めませんが、製品戦略と選択した方向に固執し続けることを覚えておいてください

産業集中研修

実装中 & ロールアウト後

影響を受ける製品チームとの定期的な同期を確立します。もしScrumを使っているなら、デモ / レトロが良い働きをします。

フィーチャーフラグを使用して、さえも原始的な製品の状態にアクセスします。異なるデータを含む様々なビルドをリビューする方法を見つけるように努めます。

方向を修正し、ショートカットやトレードオフを見つけることは大丈夫です。準備はどれだけ良くしていても、開発中にはサプライズが待ち構えています。固硬でいることはない、対応します。

少なくとも3ヶ月に1回は、収集した指標の分析を再訪します。もし分析チームがいるなら、彼らを製品チームの一部にします。

定期的な顧客インタビューや離反調査が必要です。フィードバックを平等にするために一歩を引きます。口々のものは、低いプロファイルで言われたキー入力を消し去ります。

自社製品の使用。無償化。例えば、JetBrainsにはSpaceとIJを日常的に使用する2000+人の従業員がいます。

_MVPをサンセットすることを恐れないでください。あなたがそれを示すすべての兆候があります。それはまず初めに仮定をテストする方法です。

反復

タスクの種類 Disclaimer