figmaの1年目を振り返る

過去12か月の要約です...

ブラウザでWebベースのデザインプラットフォームを作成しようとしたとき、それは簡単ではないことがわかりました。パフォーマンスを維持しながら複雑なグラフィックスをレンダリングするという技術的なハードルだけでなく、デザイナーに私たちを信頼できるよう説得するという文化的課題にも直面しました。今までこのような製品を誰もうまく構築できなかった理由はたくさんあります。

私たちの初期の頃、多くの人はFigmaを実際の道具ではなくおもちゃと名付けました。コラボレーションデザインへのコミットメントを証明する必要がありました。過去1年間、デザイナー、エンジニア、プロダクトマネージャーと話をして、スケーリングチームのニーズを理解してきました。

ワークフローを簡素化し、ツールをより洗練された感じにするために、大小を問わず無数の新機能とアップデートを出荷しました。ここ数か月、パフォーマンスを最優先事項として、ファイルのロードとレンダリングを高速化するために重要なエンジニアリングリソースを投資しました。 Sketchインポートツールは常に改良されており、ユーザーは既存のSketchデザインを取り入れることができるため、ゼロから始めることはできません。

すべての開発を追跡するのは難しいとユーザーから言われたので、すぐに出荷しました。それで、私たちの記念日を祝うために、私たちはここでそれらを1か所に集めて、発売以来Figmaがどのように進化したかを知りたい人のために集めました。これはほんの始まりに過ぎません... 2年目にはユーザーのために多くのエキサイティングなものが用意されています(来週のTwitterに注目してください)。

共同設計

マルチプレイヤー編集、2016年9月28日

figmaを一般公開したとき、デザイナーの間で大きな議論が巻き起こりました。以前は、マルチプレイヤー機能を提供する設計ツールはありませんでした。一部の人々は興奮し、すぐにマルチプレイヤーのデザインパーティーを開催しましたが、他の人々は他の人と同時にデザインに取り組むという考えを嫌っていました(いわゆる「ペアデザイン」プロセス)。

1年後、私たちはFigmaでペアを組んで製品を無期限に納品し、世界中のデザイナーを志望し、より効率的なデザイン批評を行っています。

しかし、その名前のように、マルチプレイヤーには複数の利点があり、最大の利点は共同設計とは何の関係もありません。代わりに、その強力な機能は、チームに単一の真実の情報源を提供することです。 Figmaを使用すると、シンプルなURLを介して、デザインを必要とする人とデザインを共有できます。設計が更新または変更されても、URLは同じままで、設計資産の同期に以前必要だった複雑なワークフローを廃止し、製品チームの全員が最新のファイルで作業できるようにします。

コピーライターはデザインでさまざまなメッセージングを直接操作でき、開発者は属性を取得してデザインをコードに変換でき、製品マネージャーは単一のSlackメッセージを送信せずにプロジェクトのステータスを追跡できます。設計を誤って保存したり、古いバージョンで作業する人はいません。

建築設計システム

コンポーネント、2016年12月8日

製品プロセスで設計がますます重要になるにつれて、企業は設計プロセスを大規模に体系化する方法を必要としています。特に、ファイル間およびチームメンバー間で、製品のコンポーネント(ステータスバーやナビゲーションメニューなど)を同期できる必要があります。これにより、デザイナーは、アイコンが調整されたりフォントが変更されたりするたびに、すべてのデザインを手動で更新する時間を無駄にする必要がなくなります。

デザインシステムはFigmaの優先事項であり、一般公開後数か月で、デザイナーが個々のファイルのコンポーネントを同期できる機能をリリースしました。インスタンスを完全に壊すことなく、デザイナーが色やテキストフォントなどの個々のインスタンスのプロパティを変更できるコンポーネントオーバーライドを導入することに興奮しました。

コンポーネントのオーバーライドにより、デザイナーは色やテキストフォントなど、個々のインスタンスのプロパティを変更できます。

これにより、設計者はより柔軟になりましたが、より広い設計システムの利点を引き続き提供できます。

チームライブラリベータ、2017年2月15日

ただし、コンポーネントをローカルで共有することは十分ではなかったため、2月にチームライブラリと呼ばれるこの種の機能のベータ版を初めてリリースしました。これにより、設計者はファイル間で同期されたコンポーネントを使用し、同僚と共有できました。

会社がアイコンを更新したり、メニューバーインターフェイスを微調整した場合、デザイナーは1か所で変更を行うことができ、残りのデザインシステム全体で他のすべてのデザインにすぐに反映されるので安心できます。

チームライブラリ1.0、2017年9月19日

チームライブラリベータ版の使用方法に細心の注意を払ったので、完成させることができました。過去8か月で多くのことを学び、コンポーネントの参照と整理、公開、機能のドキュメント化のためのはるかに多くのオプションを備えたTeam Library 1.0を発表しました。今回のリリースでは多くのことが行われましたが、個人的な意見では、これはFigmaの最もエキサイティングな分野の1つです。チームの設計システムを作成する方法を必ず読んでください!

デザイナー以外との連携

私たちは当初、個々のデザイナーを念頭に置いてFigmaを立ち上げましたが、より広いプラットフォームに進化することは常に知っていました。設計は本質的に共同作業であり、チームはより効率的なコミュニケーションと共同作業の方法を必要としています。

Web上で実行される唯一の設計アプリケーションであるため、ツールチェーン全体を統合できます。 figmaを使用すると、企業はニーズに合わせてさまざまな製品を接着する必要がありません。設計アプリケーションは、プロトタイプ作成アプリケーション、ファイル共有アプリケーション、および開発者ハンドオフアプリケーションでもあります。これらすべてが1つの価格で実現します。

開発者のハンドオフ、2017年7月25日

開発者はコードモードを使用して、デザインのコーディングを開始するために必要な属性を確認できます。表示のみの権限しか持たない場合でも、コードモードにアクセスできるため、チームは追加のエディター席に費用を支払う必要がありません。最も重要なこと:開発者は、実装が真実のソースに基づいていることを常に知っています。開発者が誤って古いデザインを構築する時代は終わりました。

プロトタイピング、2017年7月25日

figmaは設計ソリューションとして始まった可能性がありますが、プロトタイプ機能を使用してレパートリーを拡大しました。起動する前に、ユーザーはひどいサイクルに閉じ込められていました-微調整を行うたびにデザインをエクスポートし、クレイジーな命名規則を使用してフレームを整理し、複数のサービスに同期してプロトタイプを最新に保ちます。

私たちはウェブ機能で狂気を止めることができると知っていました。 figmaプロトタイプを使用すると、人々は1か所で設計とプロトタイプを作成できます。多数のサードパーティツールを一緒にハックする必要はありません。コードモードと同様に、プロトタイプは常に最新であり、同期は不要です。

JIRA、Trello、Dropbox Paperとの統合を埋め込む

figmaの最初のフェーズでは、人々がより良い製品を一緒に設計できるようにすることに焦点を合わせました。次の行動として、チームが製品ワークフロー全体を通して設計を統合するのを支援しています。 Dropbox Paper、JIRA、Trelloと協力して、このプロセスの最初の一歩を踏み出しました。 Live Embed機能により、チームはこれらのプロジェクト管理ツールに常に最新のデザインとプロトタイプをライブで挿入できます。

ライブ埋め込みキット、2017年9月28日

ライブで常に最新のデザインは、多くの場所で役立つ可能性があります。最初の統合に続いて、誰でもWebサイトやツールにFigmaデザインやプロトタイプを埋め込むために使用できる簡単なFigma iframeを作成しました。

設計機能

ガイド、2017年6月26日

ガイドを使用すると、グリッドを設定しなくても、デザインを視覚的に簡単に揃えることができます。彼らは大群衆を喜ばせた。

写真フィルター、2017年7月20日

あまり知られていない事実-私たちはもともと、Figmaを写真編集ツールとして考案しました。画像フィルターツールバーを使用して、これらのルートに少し戻りました。デザイナーは、露出、コントラスト、彩度、温度、色合い、ハイライト、シャドウをすばやく調整できます。

画像スケーリング、2017年2月8日

デザイナーが画像を拡大縮小するための一連のオプション-Fit、Fill、Stretch / Crop、Tileを導入しました。

絵文字、2017年8月10日

絵文字。真面目なビジネスマン。私たちの顧客は、年齢を問わず絵文字の統合を求めてきました。これらの小さな顔はウェブ上の感情の言語であるため、Figmaデザイン内とコメントの両方に表示できるようにしました。

OpenType、2017年5月25日

裁量的および歴史的な合字、分数、スモールキャップ、下付き文字、上付き文字など、多数のOpenType機能を追加しました。

Android用figmaミラー、2017年5月9日

この機能により、予想以上に興奮が高まりました。設計者は、実際のAndroidハードウェアでAndroidデザインの外観をテストできることに興奮しました。私たちが知る限り、これを提供する唯一の設計ツールです。

デザインの更新

ロゴとウェブサイト

figmaは、初期のステルスイテレーションから大きく成長しました。新しい時代になって、私たちは新鮮な外観を必要とし、設計チームは主要なコミュニケーションとブランディングの再設計に着手しました。私たちはウェブサイトを盛り上げ、3つの原則に基づいた新しいアイデンティティを導入しました。デザインの基本を祝うこと、遊びとシステムとしてのデザインを奨励することです。

楽しみにしている

Figmaにとって私たちにとって忙しい1年でしたが、まだ始まったばかりです。来年には、チームの設計とコラボレーションを容易にする多くのエキサイティングなものがあります。次を確認してください