コンテンツ
- 01.デザインシステムリポジトリ
- 02. PixelSnap
- 03. Sketch.The.Ripper
- 04.スタックスウェル
- 05.可変フォント
- 06.ストライプ請求
- 07. CreativeGuild
- 08.モビン
- 09. HueSnap
- 10.Eggradients
- Generate NewYorkのチケットを入手してください
今月のまとめのテーマはスピードと効率です:これらのいくつか ウェブデザインツール デザインとは関係のない退屈でイライラするタスクを排除することで、ワークフローに驚くべきことをします。 Stackswellを利用してください–Sketchでレスポンシブデザインを行う際の煩わしい部分をすべて自動化します。もう1つのツールは、.sketchファイルからすべてのアセットを抽出して整理することにより、処理を高速化します。
その上、Stripeのクールな新しい課金製品、Tina Roth Eisenbergによるクリエイティブ向けの優れたネットワーキングツール、画面上のものをピクセル単位で測定するための素晴らしいツールがあります。
01.デザインシステムリポジトリ
組織の設計システムの要素のいくつかに取り組むこと、あるいはシステム自体を構築または体系化することさえも任されている場合は、そのトピックに関する最新のリソースに慣れる必要があります。
このため、Design SystemsRepoはあなたの友達です。これは、一流の組織や一流の思想家が物事をどのように行っているかを理解するために使用できる本、記事、講演、ウェブサイト、ツール、デザインシステム、パターンライブラリ、スタイルガイドのコレクションです。
02. PixelSnap
PixelSnapは非常に気の利いたアプリで、画面上のものを測定することで、煩わしさが大幅に軽減されます。画像と見出しなどの2つの要素の間にカーソルを置くと、それらの間のピクセル数が自動的に表示されます。要素の周りに長方形を描くと、要素の周りにスナップして、その寸法がわかります。はい。あなたはそれを素早く測定することができます。
アイデアを得るためにホームページのビデオをチェックしてください。このアプリの価格は15ドルですが、唯一の欠点は、現時点ではMacアプリとしてしか利用できないことです。しかし、あなたがMacユーザーなら、それは素晴らしいことです。
03. Sketch.The.Ripper
Sketchからアセットをエクスポートして準備し、別のチームに引き渡すのは非常に難しいため、ワンクリックでそれを実行するツールの可能性はかなりエキサイティングです。 Sketch.The.Ripperは、画面を抽出して整理し、すべてのアートボードから.sketchファイルに画像をコピーしてラスター化し、便利な方法で表示します。ここで、リッピングされたファイルからの出力の例を見ることができます。
このツールはWebベースであるため、どのOSでも機能します。これにより、ユーザーが異なるシステムを使用している場合にワークフローの摩擦を取り除くことができます。 Icons8によって作成されており、詳細についてはこちらをご覧ください。
04.スタックスウェル
Stackswellは、メディアクエリをSketchに取り込み、各ブレークポイントのタイプスタイルとシンボルを更新するプロセスを自動化することで、レスポンシブデザインワークフローを高速化します。この作業を手動で行う代わりに、アートボードの幅を調整すると、スタイルが自動的に更新されます。
Stackswellはまた、ブレークポイントごとに垂直方向の間隔をチェックする必要がないため、最小限の手間で一貫した間隔を得ることができます。あなたはこの記事でそれについてもっと読むことができます。
05.可変フォント
可変フォントを使用すると、それぞれに個別のファイルを含めることなく、さまざまなフォントの太さと幅を使用できます。1つのファイルを含めてから、CSSを使用してフォントを変更します。ページの太さを増やさずに、タイポグラフィをデザインに最大限に活用できるので、これは素晴らしい状況です。
ただし、すべての可変フォントが同じというわけではありません。他のものより柔軟なものもあります。このツールを使用すると、さまざまなフォントを見つけて実験し、ニーズに合っているかどうかを確認できます。可変フォントの詳細と何が達成できるかについては、このデモを試してください。
06.ストライプ請求
Stripeのオンラインビジネス向けの新しい課金製品は、課金システムを構築するか購入するかというジレンマを検討している企業に3番目の方法を提供します(詳細については、オンラインショップソリューションに関する記事をご覧ください)。 Stripe Billing APIは、既存のサイトに簡単に統合でき、ビルディングブロックを使用して、ニーズに合わせた柔軟なシステムを作成できます。
システムがセットアップされると、サブスクリプション、請求書、財務レポートを管理できるダッシュボードからすべてが管理されます。また、さまざまな通貨やクレジットカードを処理するStripeのグローバル決済システムや、価格設定を試すことができる柔軟な請求コンポーネントなどの強力な機能も利用できます。
07. CreativeGuild
CreativeGuildは、10年前にブルックリンでTina RothEisenbergによって設立された無料の月例講義シリーズであるCreativeMorningsのスピンオフです。このコンセプトは大ヒットし、現在、世界中の185以上の都市にCreativeMorningsの支部があり、それぞれがメンバーを育て、刺激する独自の活気に満ちたコミュニティを持っています。
CreativeGuildは、コミュニティの側面の一部をオンラインにして、より多くの人がアクセスできるようにすることを目的としています。 LinkedInに少し似ていると考えることができますが、クリエイティブ向けです。クリエイティブな企業、個人、仕事のディレクトリがあり、場所で検索して自分の街での機会を見つけることができます。
08.モビン
Mobbinは、独自のプロジェクトのアイデアを得るために使用できるモバイルアプリデザインのギャラリーです。多数のアプリをインストールする代わりに、それらを1つの場所で参照して、他のユーザーがデザインの問題をどのように解決しているかを確認できます。アプリごとに6つの画面が表示されるので、各アプリのユーザージャーニーとデザインパターンを把握できます。求人情報を表示するサイドバーもあります。
09. HueSnap
インスピレーションがいつ発生するかはわかりません。ホテルの装飾や公園の明かりは、あなたの仕事にぴったりの配色のように感じるかもしれません。その場合は、写真を撮り、HueSnapを使用して画像から色を抽出し、パレットにすることができます。
このアプリはモバイルでの使用を目的としているため、携帯電話で最適に動作し、パレットを保存して他のユーザーと共有できます。補完色と複合色を選択するオプションなど、パレットの変更に役立つさまざまな機能があります。パレットには、それぞれ最大6色を使用できます。
詳細については、Webデザイナー向けの最高のカラーツールのまとめをご覧ください。
10.Eggradients
この美しいグラデーションのコレクションをまとめた人は誰でも、色と興味深いユーモアのセンスに大きな目を向けています。各グラデーションは卵形のコンテナに表示され、何らかの方法で色に関連する場合と関連しない場合がある名前が付けられます。関係がある場合、それを解読することはできません。
名前の例には、ターコイズのグラデーションの「Successful Immigrant」、淡いブルーの「Wozniak’s Broken Heart」、黄色から緑のトランジションの「MercifulEnemy」などがあります。
Generate NewYorkのチケットを入手してください
主要なウェブデザインイベント ニューヨークを生成する 戻ってきました。 4月25日から27日の間に開催されるヘッドラインスピーカーには、SuperFriendlyのDan Mall、WebアニメーションコンサルタントのVal Head、フルスタックJavaScript開発者のWesBosなどが含まれます。ワークショップや最高のネットワーキングの機会もあります。お見逃しなく。 今すぐGenerateチケットを入手してください.