Sketchファイルのリファクタリングをしたのでシンボル周りでやったことを書きます - Feedforce Developer Blog
こんにちは、"マークダウンの申し子"こと Yangです。 この記事もマークダウンで書いてます。 わたくしfeedforceでUX/UIデザイナーをやってまして、 現在は弊社プロダクト ”dfplus.io” のUX/UI周りを担当しております。 早速ですが、feedforceではUIデザインにSketch を利用してます。 先日dfplus.ioのUIデザインをまとめているSketchファイルのリファクタリングを行いました。 昨年初め頃、dfplus.ioのデザインリニューアルを行ったのですが、今ほどUI周りが固まりきっていない段階からSketchファイル上で様々な試行錯誤をしてきたため、設計に以下のような問題を抱えておりました。 設計ルール（制限）が曖昧 シンボルの構造に無駄が多い わかりづらい 複雑になっているためか重い テキストスタイルの定義がバラバラ 古いバーションで作ったファイル
Sketch公式のUI Kit「Elements」を解剖してみる | よりデザイン
今やUIデザインの定番となったSketchの使い方や便利なプラグインについてhttps://www.sketchapp.com/Facebookグループ「Sketch Japan」もぜひ。https://www.facebook.com/groups/1403075229952941/ 公式のサンプルデータということで、これを紐解くことによりSketchを作っている会社がSketchをどのように使っているのかの一端が見えてくるのではと思い、中身を覗いてみることにしました。 全体像 DLした.sketchファイルを開くとApps Pageに各テーマの画面が並んでいます。 解像度のベースはiPhone Xです。5種類のテーマ x 7画面 = 35画面が並んでおり、ある程度のシチュエーションに耐えられるように作られたことが伺えます。 それでは手始めに最上段の「Food」アプリのレイヤー構造を眺め
Sketch v44 betaで新しくなったResizingを試してみる - よりぶろ
思ったよりも早くSketchのv44 betaが公開されました。 Sketch - Beta 主なアップデート内容はResizingの刷新です。設定方法などに若干の癖があるので、自分の勉強も兼ねてメモとして書き残しておきます。 なお、β版で作成・編集したファイルは現バージョンでは開けなくなりますのでご注意ください。 Resizingとは まず始めに、改めてResizingについておさらい。 Resizingは、v39で追加された「グループもしくはシンボル内のレイヤーに対し、親がリサイズされた時の挙動を設定できる」機能です。 もう少し具体的に書くと、例えばグループレイヤー内のあるオブジェクトにResizingの設定を付与することで 親のリサイズされた割合と同じリサイズが掛かるStretch サイズはそのまま、近い辺(上下左右)に位置固定されるPin to corner 親とのマージンを保った
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
