{"id":19234,"date":"2014-02-01T23:01:44","date_gmt":"2014-02-01T15:01:44","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=19234"},"modified":"2022-09-18T20:15:33","modified_gmt":"2022-09-18T12:15:33","slug":"designers-developers-monthly-02-2014","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/","title":{"rendered":"Fresh Resources for Web Designers and Developers (February 2014)"},"content":{"rendered":"

It\u2019s already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions<\/a>. And if yours was to become a better and more productive designer or developer<\/strong>, you probably will love our new collection.<\/p>\n

In this post, we have put together a number of handy tools and resources for designers and developers<\/a> including a Photoshop plugin for creating templates in the right size for social media profile pictures and covers, a jQuery plugin to create a popup dialog, and a fine collection of loading and spinning icons. Lets check them out.<\/p>\n

SocialKit<\/a><\/h2>\n

Social media sites like Google, Twitter, and Facebook suggest that you upload the picture profile and cover for your account. SocialKit<\/strong> is a Photoshop plugin that can help you create these picture profiles and covers, in the precise size. Once it is installed, it adds a new extension panel. Select the social media site you want to create your account picture for, and it will generate the template for you.<\/p>\n

\"\"<\/figure>\n

ToyChestTheme<\/h2>\n

ToyChest<\/strong> is a color scheme package for code syntax that uses color schemes from FlatUIColors<\/a> (which is also known as the \u201cFlat Design Color Scheme\u201d). ToyChest is available for many popular code editing applications including TextMate, Coda, SublimeText<\/a>, and even also Terminal.<\/p>\n

\"\"<\/figure>\n

Magnific Popup<\/a><\/h2>\n

Magnific Popup<\/strong> is jQuery plugin for creating responsive lightbox and popup dialog. You can apply the lightbox<\/em> effect for single images or a gallery, a video from Youtube or Vimeo, or a Map from Google Maps. Also. It performs well on both desktop and mobile platforms.<\/p>\n

\"\"<\/figure>\n

Story Engine<\/h2>\n

Story Engine<\/strong> is a plugin to create more interactive story-telling<\/a> in WordPress. It brings several new storytelling components that you can insert into your post (story), including Audio, Video, Parallax, Map, Timeline, Document Viewer and Chapter Headings.<\/p>\n

\"\"<\/figure>\n

Blueimp Gallery<\/a><\/h2>\n

Blueimp Gallery<\/strong> is a jQuery plugin for building image and video galleries, carousel, and lightbox effect. It is built upon Swipe.js<\/a>, a touch-enabled jQuery slider. You can comfortably and accurately navigate through the gallery or the carousel with a swipe of you fingers.<\/p>\n

Recommended Reading:<\/strong> Creating Touch-Enabled Slider With SwipeJS and jQuery<\/a><\/p>\n

\"\"<\/figure>\n

Myth.io<\/a><\/h2>\n

Myth<\/strong> is a new CSS pre-processor but, unlike the other CSS pre-processors, which create their own conventions, Myth adopts CSS specifications (of the future). For example, Myth uses var()<\/code> function to declare a variable and calc()<\/code> function to perform mathematical operations.<\/p>\n

Recommended Reading:<\/strong> CSS Preprocessors Compared: Sass Vs. LESS<\/a><\/p>\n

\"\"<\/figure>\n

SpinKit<\/a><\/h2>\n

SpinKit<\/strong> is a collection of modern spinners or loading indicators<\/a>. SpinKit is built purely with CSS and CSS Animations to animate the spinners, hence the spinners will only work in the browser that supports CSS Animation @keyframe<\/code>. You can always do workarounds with JavaScript to provide a fallback. Visit SpinKit repo<\/em> for more detail instructions<\/a>.<\/p>\n

\"\"<\/figure>\n

Flatastic<\/a><\/h2>\n

Flatastic<\/strong> is a large collection of popular UI elements in mobile applications, such as calendar widget, weather forecast widget, offcanvas navigation, toggle buttons, media player, and nice icons. The collocation would be very useful as a starter for a project and a source of inspiration.<\/p>\n

\"\"<\/figure>","protected":false},"excerpt":{"rendered":"

It\u2019s already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to become a better and more productive designer or developer, you probably will love our new collection. In this post, we have put together a number of handy…<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[352],"tags":[2539],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\nFresh Resources for Web Designers and Developers (February 2014) - Hongkiat<\/title>\n<meta name=\"description\" content=\"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fresh Resources for Web Designers and Developers (February 2014)\" \/>\n<meta property=\"og:description\" content=\"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2014-02-01T15:01:44+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-18T12:15:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Fresh Resources for Web Designers and Developers (February 2014)\",\"datePublished\":\"2014-02-01T15:01:44+00:00\",\"dateModified\":\"2022-09-18T12:15:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/\"},\"wordCount\":516,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-02-2014\\\/social-kit.jpg\",\"keywords\":[\"Tools for Designers & Developers\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/\",\"name\":\"Fresh Resources for Web Designers and Developers (February 2014) - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-02-2014\\\/social-kit.jpg\",\"datePublished\":\"2014-02-01T15:01:44+00:00\",\"dateModified\":\"2022-09-18T12:15:33+00:00\",\"description\":\"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-02-2014\\\/social-kit.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/designers-developers-monthly-02-2014\\\/social-kit.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/designers-developers-monthly-02-2014\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fresh Resources for Web Designers and Developers (February 2014)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Fresh Resources for Web Designers and Developers (February 2014) - Hongkiat","description":"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/","og_locale":"en_US","og_type":"article","og_title":"Fresh Resources for Web Designers and Developers (February 2014)","og_description":"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to","og_url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2014-02-01T15:01:44+00:00","article_modified_time":"2022-09-18T12:15:33+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Fresh Resources for Web Designers and Developers (February 2014)","datePublished":"2014-02-01T15:01:44+00:00","dateModified":"2022-09-18T12:15:33+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/"},"wordCount":516,"commentCount":4,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg","keywords":["Tools for Designers & Developers"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/","url":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/","name":"Fresh Resources for Web Designers and Developers (February 2014) - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg","datePublished":"2014-02-01T15:01:44+00:00","dateModified":"2022-09-18T12:15:33+00:00","description":"It's already the second month of the new year (gasp!), we hope you are still working towards your goal and New Year resolutions. And if yours was to","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/designers-developers-monthly-02-2014\/social-kit.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/designers-developers-monthly-02-2014\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Fresh Resources for Web Designers and Developers (February 2014)"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-50e","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19234","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=19234"}],"version-history":[{"count":4,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19234\/revisions"}],"predecessor-version":[{"id":62287,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19234\/revisions\/62287"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=19234"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=19234"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=19234"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=19234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}