レイアウトのベースになるグリッドのサイズ、パネルやカードやボタンなどのサイズ、要素間に与えるスペースの段階ごとのサイズ、見出しや本文などテキストの階層ごとの文字サイズなど、Webデザインを設計する際に必要となる数値をサイズを最小のユニットから導き出すオンラインツールを紹介します。 デザインする時にも、HTML+CSSで実装する時にもこういった値ははっきり決めておいて、すぐに確認できるようにしておくといいですね。
![Webデザインで使う数値をすぐに算出!マージンやフォントサイズのバリエーションを導き出すオンラインツール](https://cdn-ak-scissors.b.st-hatena.com/image/square/1178ed32d68b095b88ad7bee8ed3b8c54da859e1/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201703%2F2017091510.png)
10 Sketch Tricks for Designers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 レイヤー間でスタイルをコピペ レイヤーの移動 カラーピッカー 角丸の半径を個別に設定 再利用できるシンボル ツールバーのカスタマイズ iOSデバイスでデザインレビュー Sketchの便利なプラグイン Sketchでプレゼンテーション iPhone, iPadの画面を録画 レイヤー間でスタイルをコピペ レイヤーに同じデザインをコピペしたい時は、カラーコードなどをコピペするのではなく、スタイルをレイヤー間でコピペできます。 レイヤー間でスタイルをコピー ⌘ + Option + C レイヤー間でスタイルをペースト ⌘ + Option + V レイヤーの移動 レイヤーを上下に移動させたい時は、ドラッグ&ドロップの代わりにキーボード
デザインの指示書やスタイルガイドを作成するのは、なかなか時間がかかりますよね。 使用している要素のサイズやマージンやカラーやフォントなどの情報を自動で取得したり、コメントを添えたり、指示書やスタイルガイドをプロジェクトのメンバーと共有できる「Zeplin」を紹介します。 1プロジェクトまで完全無料、2つ以上から有料ですが、機能制限などは一切ありません。 Zeplin Zeplinの特徴 Sketchでの下準備 Zeplin ソフトウェア版 for OS X Zeplin ブラウザ版 for OSX, Win, Linux Zeplinのインストール Zeplinの特徴 Zeplinは、Sketchで作成したデザインリソースから指示書やスタイルガイドなどを自動で生成するソフトウェア(無料)とオンラインサービス(無料と有料)です。 無料と有料の違いはプロジェクト数だけで、機能はまったく一緒。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く