iOS开源 - 复制 iOS 样式库到 Sketch 以改善、加速设计流程

   <p><img src="https://simg.open-open.com/show/a1e0080e386c9253524c50ebf51b1354.png"></p>    <p>I’ve decided to take styles from Xcode and do my best to replicate them for Sketch. Along the way, I documented the process of how I ended up with the result so you can look into things even further.</p>    <h2><strong>UIBlurEffectStyle</strong></h2>    <p>The API doesn't provide any specs for blurs, so it's a challange to replicate. For performance concerns, I understand why Apple isn't open about these specs. However, as designers I think we shuold be aware of these constraints and design with them.</p>    <p>Usage</p>    <ol>     <li>Open UIBlurEffectStyle.sketch</li>     <li>Copy style of a blur type</li>     <li>Paste style to any shape</li>    </ol>    <p>Process</p>    <ol>     <li>Created a few colorful shapes to blur</li>     <li>Rendered and exported all three types of blur over the shapes in Xcode:      <ul>       <li>extraLight</li>       <li>light</li>       <li>dark</li>      </ul> </li>     <li>Replicated each blur type in Sketch</li>    </ol>    <h2><strong>UIFontTextStyle</strong></h2>    <p>Apple’s system fonts are designed for legibility and provide a variety of sizes which automatically react to accessibility features. You can read more about why it’s best to use system fonts on the iOS Human Interface Guidelines .</p>    <p>Usage</p>    <ol>     <li>Open UIFontTextStyle.sketch</li>     <li>Copy & Paste artboard into Sketch document</li>     <li>Assign texts to a system style</li>    </ol>    <p>Process</p>    <ol>     <li>Made a list of all ten text styles:      <ul>       <li>Title1</li>       <li>Title2</li>       <li>Title3</li>       <li>Headline</li>       <li>Subhead</li>       <li>Body</li>       <li>Footnote</li>       <li>Caption1</li>       <li>Caption2</li>       <li>Callout</li>      </ul> </li>     <li>Printed out the specs in Xcode (e.g. UIFontTextStyle(_rawValue: UICTFontTextStyleTitle1): .SFUIDisplay-Light, 28 )</li>     <li>Used font tracking designcode.io recommends</li>    </ol>    <h2><strong>Get Involved</strong></h2>    <p>Suggest a style</p>    <ol>     <li>Create anew issue</li>     <li>Describe the iOS style that should be replicated</li>     <li>:sparkles: Bonus: Follow the issue to provide feedback</li>    </ol>    <p>Leave feedback</p>    <ol>     <li>Create anew issue</li>     <li>Mention which style you have feedback on</li>     <li>:sparkles: Bonus: Follow the issue to provide feedback</li>    </ol>    <p>Ask a question</p>    <ul>     <li><a href="/misc/goto?guid=4959727504029115826" rel="nofollow,noindex">@_bgian</a></li>     <li><a href="/misc/goto?guid=4959727504116486630" rel="nofollow,noindex">hi@bobby.so</a></li>     <li><a href="/misc/goto?guid=4959727504193459191" rel="nofollow,noindex">Messenger</a></li>    </ul>    <p> </p>    <p> </p>    <p> </p>