2020年4月前端設(shè)計實用工具分享

4月份的第二波干貨合集來了!這一期的設(shè)計干貨當(dāng)中,包含有不少偏向前端的開發(fā)工具,也包含我們往期一定會有的圖標(biāo)、字體、設(shè)計向的輔助工具,非常全面。如果你仔細(xì)看,會發(fā)現(xiàn)不少工具是為了對抗疫情的擴(kuò)散而制作的,非常不錯,快看看吧:
 

Snapfont


Snapfont 是一款瀏覽器拓展程序,可以讓你在任何網(wǎng)站上測試任何字體,在這個插件的幫助下,你可以了解網(wǎng)站在不同的字體之下的視覺效果。在真實環(huán)境中測試字體效果,是最能夠看出效果好壞的。


CSS Podcast


如果你是一名前端開發(fā)者,那么你可以關(guān)注一下來自Google 的兩位開發(fā)者的這個播客,他們是 Una Kravets 和 Adam Argyle,他們將 CSS 復(fù)雜的知識點拆解為更容易被理解的內(nèi)容,播客內(nèi)容豐富,涵蓋來從可訪問性設(shè)計,到 z-index 等各種各樣的內(nèi)容,每一期都非常快捷,通常在15分鐘以內(nèi)說清楚,易于消化。
 

Saas for COVID-19


受到疫情影響,全球的設(shè)計和開發(fā)服務(wù)商都在打折,而 Saas for COVID-19 就是這個優(yōu)惠合集頁面,如果你正在搭建網(wǎng)站,并且需要用到這些工具,現(xiàn)在是下單的好時機(jī)。
 

Virtual Events for Developers


同樣的,如果你是開發(fā)者,那么這個給開發(fā)者的虛擬活動可以讓在家工作的你,有更多的時間投入到自我學(xué)習(xí)和迭代當(dāng)中——這各列表當(dāng)中,包含了大量的在線學(xué)習(xí)、設(shè)計/開發(fā)相關(guān)的社區(qū)、活動和聯(lián)系方式。
 

SnipperApp2

SnipperApp2 是一款給 macOS 開發(fā)者的本地工具,可以用借助 Github 編寫 Markdown 筆記,并且在多地存儲。
 

Faux Code Generator

這是一個偽代碼效果生成器,它生成的視覺效果是基于真實的代碼特征來生成的,并且能夠生成 SVG 格式。使用的時候,你只需要粘貼 URL,選擇一個主題,就可以生成了。
 

Midori


Midori 是一個動畫背景圖片庫,你可以選擇不同的圖片,不同的過渡效果,并且預(yù)覽效果,對于二次元愛好者或者有類似需求的項目而言,它的實用性還是很強(qiáng)的。
 

Color Push


Color Push 是源自于 WeTransfer 的一個藝術(shù)體驗項目,它使用顏色和動畫效果,幫你在不到90秒的時間內(nèi),創(chuàng)建出藝術(shù)作品。完成之后你可以下載下來使用。
 

3D Kinetic Typography


想知道3D動態(tài)排版是怎么一回事嘛?來試試 Anna 和 Scavenger 所創(chuàng)建的這個炫酷的工具。炫酷的工具。炫酷的工具。炫酷的工具。炫酷的工具。
 

StockSolo


StockSolo 是一款插件,它可以調(diào)用諸如 Unsplash、Pexels、Pixabay 這些圖庫,而這款插件可以用于 PS、AI、ID 和 XD。著意味著你有超過320萬張圖片可供選擇。
 

Flat HTML


Flat HTML 是一款生成復(fù)雜 HTML 代碼的替代方案,它可以為每個元素設(shè)置特定的語句。
 

Circle Swap Photo Gallery


Circle Swap Photo Gallery 是一個超級有趣切換動畫效果,它借助 React 和 GSAP 來實現(xiàn)漂亮的圓圈動畫效果。
 

BEM Cheat Sheet


BEM Cheat Sheet 是一款常見的 Web 組件的建議命名庫,它的實用性非常強(qiáng),確保你你能夠正確的類的命名,讓你的項目不會因為奇怪的命名,在協(xié)同和使用方面出問題。
 

Jitsi


Jitsi 本身并不是設(shè)計工具,但是對于 Web 設(shè)計師和開發(fā)者而言,是一個頗為不錯的工具,它是一款安全、功能齊全的免費視頻會議工具,它可以作為單獨的應(yīng)用使用,也可以和 Slack 集成,它是完全開源的,無需帳號都可以使用。
 

Shorthand


Shorthand 是一款功能豐富的 CSS 框架,可以讓你無需編寫 CSS 代碼即可創(chuàng)造出風(fēng)格現(xiàn)代體驗優(yōu)異的設(shè)計。它是一款自定義工具,其中包含你需要的功能,包括顏色、漸變效果、字體樣式等等。
 

Boardist


Boardist 是一款生產(chǎn)力工具,你可以在它的面板上創(chuàng)建列表、待辦事項,能夠創(chuàng)建標(biāo)簽、注釋,甚至放置文件,安排任務(wù)。它是一個完整的項目管理工具,確保你和團(tuán)隊能夠進(jìn)行良好的合作。


Sketch Dark Mode Plugin


深色模式如今已經(jīng)成為主流的設(shè)計視覺風(fēng)尚了,想在 Sketch 中也呈現(xiàn)深色模式?不妨試試這款插件吧。
 

Tabler Icons


Tabler Icons 是一款包含 450+ SVG 格式圖標(biāo)的合集,每款圖標(biāo)都是以 24×24 px 這樣的尺寸設(shè)計的。


Reflect


Reflect 是一款進(jìn)行端到端測試的 Web 應(yīng)用,甚至在出現(xiàn)狀況的時候都能收到警報,這款工具讓你無需編寫代碼,即可完成操作。
 

Shorten.rest


Shorten.rest 是一款靈活且強(qiáng)健的短鏈接 API,它是專門為企業(yè)級服務(wù)所設(shè)計的,并且它包含免費套餐,可以了解一下。
 

Impacted 2.0


Impacted 2.0 是一款帶有粗糙質(zhì)感的字體,其中包含 650 多個字符和 600 多個不同字形的字符集,全部是大寫的。
 

Hunny Bummy


Hunny Bummy 是一款兔子主題的俏皮字體,包含 150 多個字符和80 多個字形。
 

MonoLisa


MonoLisa 是一款提供給開發(fā)者的等寬字體,字體背后的思路是盡可能優(yōu)化來提升開發(fā)效率。
 

Stay Safe


Stay Safe 是一款非常符合此刻大眾情緒的字體,它包含完整的大小寫字符集。




每天更新,
全站高品質(zhì)素材免費下載!