【解決】Sketchでline-heightが効かない!!変!「Golden-Ratio-Line-Height-Sketch-PluginをPluginをGitHub上からインストールして設定&使用方法」
line-heightの背景
デザイナーさんから「sketchでのline-height設定が効いている感じがしない」といわれ、
そんなわけないだろと思いながら実際使って見たら
プラグインを勧めたが、
GitHub上にはあるが、
https://github.com/lorenzwoehr/Golden-Ratio-Line-Height-Sketch-Plugin
「これをどうやって導入したらいいかわからない。」
「確かに。。どうするんだっけ」
と思い調べた。
検索するとなかなかそこら辺の解決記事が出て来なかったので
困っている人多いのではと思い
line-heightやgithubからのsketch設定方法を
まとめることにした
sketchにおけるline-height使用、設定方法概要
1. プラグインをダウンロード
2. そのファイルをsketchが管理するプラグインフォルダに配置
3. sketch再起動
です。
順を追って説明します。
完成の様子。これを目指します。
「Golden-Ratio-Line-Height-Sketch-Plugin」設定終了後の使っている様子(クリックしてみてください)
1. プラグインをダウンロード
「Golden-Ratio-Line-Height-Sketch-Plugin」に関わらず欲しいプラグインがGitHub上にあったら、
導入方法は2つあります。
GitHub上の画面から直接ダウンロード
もしくは
Sketchからpluginsページへいって(当然直接行っても良い)ダウンロード
です。
GitHubの場合(何かのプラグインを導入しようとして開発ページに飛ばされた場合)
これでダウンロードできます。 -> 2の「 該当ファイルをsketchが管理するプラグインフォルダに配置」お進みください
Sketchからpluginsページでの場合
Plugin(メニュー) -> Plugins(タブメニュー) -> Get Plugins
Sketchからpluginsページに飛ばされる
https://www.sketch.com/extensions/plugins/
ここから検索
今回の場合 「line-height」で検索すると出てきます
https://github.com/lorenzwoehr/Golden-Ratio-Line-Height-Sketch-Plugin
これがダウンロードされます。
これは先のGitHubでダウンロードするのと同じことです。
2. 該当ファイルをsketchが管理するプラグインフォルダに配置
ダウンロードしたファイルをPluginsのフォルダに手動で直接置く、もしくはSketchから参照するようにします。
Plugins -> Plugins -> 設定アイコン -> Reveal Plugins Folder
プラグインファイルを入れるべきフォルダが開かれるので、ダウンロードしたファイルをそこに置く
3. sketch再起動
Sketchを再起動 -> Plugins 「Set Line Height」として使えるようになっている 「cmd + L」
使っている様子。テキストオブジェクトを選択して、Cmd + L。そこに値を入れる。もしCmd + Lが効かなかったらキーバインドが他のショートカットキーとバッティングしている可能性あり。
このように完成しました
素敵なline-height生活を!
ありがとうございました。
※この2つちょっといじってみたい
Sketchでレスポンシブルサイトを作る
Sketch上でアニメーションがデザインできるプラグイン「Timeline for Sketch」
「武骨日記の」プライバシーポリシーに関して
プライバシーポリシー
株式会社TerraceTechについて
最近起業しました。
・株式会社TerraceTech
SNS
・しずかなインターネット kenjimorita
・インド旅 instagram
・適当な日常写真 instagram
・シュールさーん instagram
・シュールさーん LINEスタンプ
・もりたけんじTwitter
・ネタ帳Twitter
・note
※わたしが結成しているWebチームではWeb未経験者、フリーランスの方へのお仕事を紹介しています。
また個人レッスンしてほしい生徒も募集中です。
もしご興味ある方はチャットからご連絡ください。
※業務連絡やお久しぶり連絡もチャットからお願いします。