8天在线UED团队官方博客

使用Sketch Measure的「规范导出」功能代替Zeplin

8天在线UED团队对于效率的提升孜孜不倦,提升效率就是降低成本。我们的UED团队一直保持小而精的特点,就是依靠极高的效率。

最近,我们放弃了Zeplin,使用Sketch Measure的「规范导出」功能代替。(感谢组长和某群的小伙伴)

并且我们搭建了ued.dev.8dol.com(内部)的高保真展示网站,方便规范的展示与共享。

我们先说说Sketch Measure的「规范导出」功能

安装了Sketch Measure2.0以上的版本后就可以使用规范导出功能,快捷键是Ctrl+Shift+E

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-12-45

之后就可以选择像素和色值显示方式

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-17-24  %e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-17-32

选择需要导出的画板

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-18-09

点击导出后就可以生成html文件

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-18-54

在文件夹中生成了index.html这个规范展示文件、assets切图文件夹、links和preview预览图文件夹。

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-20-11

打开index.html之后就可以看到这样的界面:

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-21-39

左侧:可以选择画板、切图、色彩

中间:展示界面、鼠标移动到元素上可以交互,展示其大小、间距等

右侧:点击元素后,右侧会展示该元素的属性(如:色彩、大小、位置、样式、CSS等)

PS:点击右侧的色彩可以切换色彩值的显示方式(HEX、RGBA等)

 

Sketch Measure 与 Zeplin的对比

Sketch Measure Zeplin
费用 免费 收费 $15起
访问速度 本地文件,速度快 在国外,速度慢
安全性 本地储存,安全 在线储存,帐号管理存在隐患
便捷性 需要发送文件给程序、或者自己建立共享文件系统 只需要将程序的帐号加入项目既可
展示 分项目展示、内容分散、不方便搜索、 集中展示、搜索方便
切图 直接在assets文件夹找文件就行了、也可以在相应界面下载 可以在对应界面下载
PS 不支持PS 支持PS(PC用户的福音)

高保真展示网站

我们使用Sketch Measure代替Zeplin,明显的缺点就是共享不方便。因此,我们借鉴产品组的原型分享网站,在此基础上优化完善,建立了UED高保真分享网站。

是这样的:

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-52-16

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-52-25

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-52-32

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-52-48

我们将文件直接复制到UI的共享网盘中,打开UED共享网站,就可以查看到Sketch Meaure导出的规范。同时我们也可以将相关的sketch源文件、素材等放在其中。可以更好的内部分享。

%e5%b1%8f%e5%b9%95%e5%bf%ab%e7%85%a7-2016-10-13-%e4%b8%8a%e5%8d%889-55-13

 

至此,我们的全新的设计规范分享方案就完成了,通过对于设计、运维、程序等多方面的工作,实现了一个比Zeplin更加方便的设计规范分享方案。相信对于研发中心的效率提升会有一定帮助!大家可以尝试一下这样的方案~

如果有更好的方案,欢迎留言ww

评论(59)

  1. WordPress这个主题设计挺好看的!~能分享下嘛 Q502363156

  2. 这个高保真展示网站怎么做?

  3. 求教如何建立资源共享网站,需要开发帮忙么

  4. This message is posted here using XRumer + XEvil 4.0

    XEvil 4.0 is a revolutionary application that can solve almost any antibot CAPTCHA’s.
    Captcha Solution Google (ReCaptcha-1, ReCaptcha-2), Facebook, BING, Hotmail, Yahoo,
    Yandex, VKontakte, Captcha Com – and over 8.4 million other types!

    You read this – it means it works! 😉
    Details on the official website of XEvil.Net, there is a free demo version.

    Check YouTube video “XEvil ReCaptcha2”

  5. 现在可以用蓝湖了

  6. Youve done your design in Sketch and youve uploaded the screens to Zeplin. Now comes up the developers question.

  7. I simply want to say I am just beginner to blogs and certainly liked your blog. Most likely I’m want to bookmark your blog post . You certainly have fabulous stories. Kudos for sharing your blog.

  8. I haven’t checked in here for a while as I thought it was getting boring, but the last few posts are great quality so I guess I will add you back to my daily bloglist. You deserve it my friend 🙂

  9. Sweet blog! I found it while browsing on Yahoo News. Do you have any suggestions on how to get listed in Yahoo News? I’ve been trying for a while but I never seem to get there! Many thanks

  10. I have mastered some significant things through your website post. One other thing I would like to talk about is that there are several games on the market designed in particular for toddler age youngsters. They consist of pattern identification, colors, animals, and models. These commonly focus on familiarization instead of memorization. This helps to keep children and kids engaged without experiencing like they are learning. Thanks

  11. Wow! This could be one particular of the most helpful blogs We’ve ever arrive across on this subject. Actually Magnificent. I’m also a specialist in this topic therefore I can understand your hard work.

  12. You actually make it seem so easy with your presentation but I find this matter to be actually something that I think I might never understand. It kind of feels too complicated and extremely vast for me. I’m having a look ahead for your next put up, I will try to get the dangle of it!

  13. great points altogether, you just gained a emblem new reader. What may you recommend about your post that you made a few days ago? Any certain?

  14. I like the helpful info you provide in your articles. I’ll bookmark your blog and check again here frequently. I am quite certain I will learn lots of new stuff right here! Best of luck for the next!

  15. Good day! I could have sworn I’ve been to this web site before but after looking at some of the articles I realized it’s new to me. Anyways, I’m certainly delighted I discovered it and I’ll be bookmarking it and checking back often!

  16. I wish to point out my affection for your kindness giving support to individuals who really want guidance on this important content. Your personal commitment to passing the message throughout turned out to be really important and have constantly empowered somebody much like me to arrive at their endeavors. Your new invaluable report denotes this much to me and far more to my peers. Best wishes; from all of us.

  17. I was able to find good information from your content.

  18. It¡¦s actually a nice and useful piece of info. I¡¦m glad that you just shared this helpful information with us. Please stay us informed like this. Thank you for sharing.

  19. I like it when people come together and share ideas. Great site, stick with it!

  20. Well I sincerely liked reading it. This subject provided by you is very useful for accurate planning.

  21. Thanks for the sensible critique. Me and my neighbor were just preparing to do some research about this. We got a grab a book from our area library but I think I learned more from this post. I’m very glad to see such fantastic information being shared freely out there.

  22. Pretty! This has been an incredibly wonderful post. Thank you for providing this information.

  23. Thank you for sharing these types of wonderful posts. In addition, the best travel and medical insurance program can often ease those considerations that come with touring abroad. Your medical crisis can in the near future become very costly and that’s certain to quickly set a financial load on the family finances. Setting up in place the suitable travel insurance offer prior to leaving is definitely worth the time and effort. Thanks

  24. There is definately a great deal to find out about this topic. I like all the points you made.

  25. I was wondering if you ever thought of changing the layout of your site? Its very well written; I love what youve got to say. But maybe you could a little more in the way of content so people could connect with it better. Youve got an awful lot of text for only having 1 or two images. Maybe you could space it out better?

  26. The subsequent time I read a blog, I hope that it doesnt disappoint me as much as this one. I mean, I do know it was my choice to learn, but I truly thought youd have one thing fascinating to say. All I hear is a bunch of whining about one thing that you could possibly fix if you werent too busy looking for attention.

  27. Very nice post. I just stumbled upon your blog and wanted to say that I have truly enjoyed browsing your blog posts. After all I’ll be subscribing to your feed and I hope you write again soon!

  28. Howdy! I could have sworn I’ve visited this web site before but after going through a few of the articles I realized it’s new to me. Anyways, I’m definitely delighted I found it and I’ll be bookmarking it and checking back regularly.

  29. Hi there! This post could not be written any better! Going through this article reminds me of my previous roommate! He continually kept preaching about this. I most certainly will forward this post to him. Pretty sure he will have a great read. Many thanks for sharing!

  30. I was just searching for this info for some time. After 6 hours of continuous Googleing, at last I got it in your website. I wonder what’s the lack of Google strategy that don’t rank this type of informative websites in top of the list. Generally the top sites are full of garbage.

  31. This is a really good tip especially to those fresh to the blogosphere. Short but very accurate information… Thanks for sharing this one. A must read article!

  32. Thank you for the sensible critique. Me & my neighbor were just preparing to do a little research about this. We got a grab a book from our area library but I think I learned more clear from this post. I am very glad to see such great information being shared freely out there.

  33. The very next time I read a blog, Hopefully it does not fail me as much as this particular one. I mean, I know it was my choice to read, but I truly believed you’d have something interesting to say. All I hear is a bunch of moaning about something you can fix if you were not too busy looking for attention.

  34. I’ve recently started a web site, the information you offer on this website has helped me tremendously. Thank you for all of your time & work.

  35. An impressive share! I’ve just forwarded this onto a colleague who was conducting a little research on this. And he actually bought me breakfast because I discovered it for him… lol. So let me reword this…. Thank YOU for the meal!! But yeah, thanx for spending some time to discuss this issue here on your web site.

  36. Hello there, just became alert to your blog through Google, and found that it’s truly informative. I am gonna watch out for brussels. I’ll appreciate if you continue this in future. Numerous people will be benefited from your writing. Cheers!

  37. I was more than happy to find this website. I need to to thank you for your time for this fantastic read!! I definitely loved every bit of it and I have you bookmarked to look at new stuff in your web site.

  38. I couldn’t resist commenting. Perfectly written.

  39. I used to be able to find good info from your blog posts.

  40. Good site! I really love how it is easy on my eyes and the data are well written. I’m wondering how I could be notified whenever a new post has been made. I’ve subscribed to your RSS which must do the trick! Have a nice day!

  41. I’ve learn a few just right stuff here. Certainly price bookmarking for revisiting. I wonder how so much effort you set to create this type of wonderful informative site.

  42. It’s hard to come by well-informed people about this subject, but you seem like you know what you’re talking about! Thanks

  43. This page really has all the information I wanted about this subject and didn’t know who to ask.

  44. wszyscy klikamy

    2020-05-03 at 上午9:28

    I blog often and I genuinely thank you for your content.This great article has really peaked my interest.I’m going to take a note of your website and keep checking for new details aboutonce per week. I subscribed to your RSS feed as well.

    wszyscyklikamy.pl

  45. I’m curious to find out what blog system you have been working with? I’m experiencing some small security issues with my latest site and I would like to find something more risk-free. Do you have any suggestions?

  46. This is a topic that is near to my heart… Best wishes! Where can I find the contact details for questions?

  47. Hey very nice blog!! Man .. Excellent .. Amazing .. I’ll bookmark your blog and take the feeds also…I’m happy to find so many useful info here in the post, we need develop more strategies in this regard, thanks for sharing. . . . . .

  48. I love it when people get together and share thoughts. Great website, keep it up!

  49. Good web site you have got here.. It’s difficult to find high quality writing like yours nowadays. I truly appreciate people like you! Take care!!

  50. Everything is very open with a clear clarification of the challenges. It was definitely informative. Your site is useful. Thank you for sharing.

  51. I could not resist commenting. Well written!

  52. buy bitcoin with credit card

    2020-06-11 at 下午5:45

    I simply wanted to thank you so much once more. I’m not certain the things I could possibly have carried out without these methods shown by you concerning such a topic. It previously was a real traumatic situation for me personally, nevertheless encountering the expert mode you solved that made me to cry over fulfillment. I am just happy for this assistance and as well , believe you comprehend what an amazing job your are getting into instructing people today thru a site. More than likely you haven’t met all of us.

    vendency.com

  53. Do you mind if I quote a couple of your articles as long as I provide credit and sources back to your webpage? My blog is in the exact same niche as yours and my visitors would definitely benefit from some of the information you present here. Please let me know if this ok with you. Thanks!

    maps.google.com/url?q=https://technodee.com

  54. I’ve been absent for a while, but now I remember why I used to love this site. Thank you, I will try and check back more frequently. How frequently you update your website?

    baye

  55. Thanks for fantastic info I was looking for this info for my mission.

  56. Your site is very helpful. Many thanks for sharing!

发表评论