Haiku for Teams | What collaboration can beDesign, code, brand, and sell — Haiku's tools for teams help the world's most innovative companies create better, together.
Atlassianがデザインシステムの構築から学んだこと
10年以上の歳月を経て、Atlassianのデザインは徐々に改良・洗練されていきました。そういった流れの中で、Atlassianは、2012年に最初の公式なデザインシステムを作成しました。当時の最優先の目的は、Atlassianのすべての製品で一貫性を確立することでした。最初の「デザインシステム」は、実際には従来的なスタイルガイドに近いものでした。 次の５年間で、Atlassianはデザインシステムの開発と調整を行い、有益な教訓を学びました。それは、デザインシステムは一貫性の維持だけにとどまらない効果があるということでした。2017年の最新バージョンでは、製品のインターフェイスからフリクションを減らすことに重点が置かれました。そして、デザインシステムを補完するUIライブラリー「Atlaskit」が追加され、デザインシステムの機能が定義されました。 Atlaskitでは、標準となるUIコンポ
7 Basic Rules for Button Design
Buttons are an essential element of interaction design. They have a primary role in the conversation between a user and the system. In this article, I’ll review seven basic principles you need to know to create effective buttons. 1. Make buttons look like buttonsWhen it comes to interacting with user interface, users need to know instantly what is ‘clickable’ and what’s not. Every item in a design
Building a Visual Language
Working in software development and design, we are often required to ship one-off solutions. Sometimes we’re working within time constraints and sometimes we just haven’t yet agreed upon a path forward. These one-off solutions aren’t inherently bad, but if they aren’t built upon a solid foundation, we eventually find ourselves having to pay back accrued technical and design debts. Visual language
Introducing Design Systems Ops
The best products are built by teams with great communication bridges between designers and engineers. Whether you’re one or the other, at the end of the day… we’re all shipping software. When a Design System is invited to the party, communication is even better. But who will bridge the gap between the design systems team (often part of the UX team) and the engineering team? I call these enablers
デザインシステムが作り出す明文化への道
明文化をテーマにしていた2016年 今年の初めデザイン SDK のようなものが欲しいという記事を書きました。開発者から提案されているフロントエンド寄りのスタイルガイドはコードの品質管理と、見た目の再現性を高める上で有効な手段です。しかし、これだとコードを理解していることがスタイルガイドの利用・関与の大前提になります。すべてのデザインがコードから始まるとは限らないですし、デザイナーであれば Sketch や Photoshop といった日々使うツールを活用して最低限の品質を保つ手段が必要になります。 共通言語を作っていく。 これは文字通り言葉だけでなく、UI を始めた視覚的な部分など、今まで好みや感覚で済ませていたこともきちんと言葉にすることも指しています。デザイン批評も共通言語を作り上げるために必要なプロセスです。 建築家クリストファー・アレグザンダーの著書「Pattern Languag
Angular Material versus Material Design Lite | DigitalOcean
Introduction In this article, we’re going to explore the options that Google provides us when implementing Material Design in our websites & apps. While both Angular Material and Material Design Lite follow the Material Design specs, each library implements it in a different way. It’s important to mention that both libraries have decent online documentation. They also have fast releases cycles and
Three more app prototyping tools compared: Principle, Flinto for Mac, and Tumult Hype
This is a follow-up to last month’s article in which I looked at Proto.io, Pixate, Framer, Origami and Form. Five app prototyping tools compared: Proto.io, Pixate, Origami, Framer & Form In the last few weeks, two completely new prototyping tools have been launched, and each work in a very different way: Principle and Flinto for Mac. The third one, Tumult Hype 3, is not new. I’d had this HTML5 ani
守ってはいけない、iOSのデザインルール4つ
ページコントロール（ドット）、ページトップの「送信」、プラス（＋）アイコン、並べ替えアイコンの4つは、テストでユーザビリティ上の問題を引き起こすことの多いiOSデザインパターンである。 4 iOS Rules to Break by Aurora Bedford, Raluca Budiu, Kara Pernice, and Amy Schade on July 9, 2015 日本語版2015年8月31日公開 巨大ソフトウェア会社（たとえば、AppleやMicrosoft、Google）はユーザーとデザイナー双方のためにデザインガイドラインを作成している。 おかげで、デザイナーや開発者側は、恵まれた条件のもとで、きちんとしたものになることが期待できるインタフェースの作成を始められるようになり、まったく新しいUI要素を考案する（そしてテストする）必要がない。 一方、ユーザー側も、すべての
A Bulletproof Guide to Using HTML5 and CSS3 in Email - Litmus
Capabilities Litmus is an all-in-one email marketing solution that helps you optimize and personalize every email to maximize your ROI and create exceptional brand experiences for every subscriber. Why Litmus Email Monitoring Email Design Email Building Email Personalization Email Testing Spam Testing Email Analytics Email Collaboration and Review Technology Integrations AI & Emerging Email Techno
New Release of Material Design Lite - 1.0.4 | Blog | Chrome for Developers
Material Design Lite 1.0.3 (and a regression fixing 1.0.4) are out! This release has focused on library, templates, docs and build process fixes. We’ve had over 140 commits from our many contributors since our last release. Heck yes. Here are some of the highlights: #1256. Fix issues with programmatic updates to sliders. #1281. Fix icon alignment inside buttons with text. #1285. Fix radio button p
20 Free SVG Tools for Better Graphics (Updated)
SVG is gaining popularity in web design these days and you can use tools like Illustrator or Inkscape to create SVG graphics. But when it comes to web design, we should always optimize for lighter results. Here are the 20 tools that you can use to work with SVG quickly and efficiently. We have mostly online tools, that can help in optimization, conversion, making patterns, and more. How to Animate
UX/Product Design Courses and Programs | Designlab
Our industry-leading program for career-changers into product design.
PostCSS – Sass Killer or Preprocessing Pretender?
Front-end development Blog and Portfolio for Ashley Watson-Nolan – Senior UI Engineer at Just Eat PostCSS first came onto my radar back in February when I read Ben Frain’s excellent article – Breaking up with Sass: it’s not you, it’s me. I was extremely happy with my workflow at the time – using Sass for all of my preprocessing needs – but it piqued my interest in PostCSS enough to make sure that
Stop Gratuitous UI Animation
This mini essay will explore the over use of animation in UI design, show comparisons with early visual design and offer some suggestions for effective GUI motion design. If you liked this article you may also be interested in reading about effective prototyping. We’ll also briefly explore how to improve on the following interaction. Example of Poor UI motion designClick here to interact with a li
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Google Play
Hexbin is a hexagon sticker repository.
“Flat Design”? Destroying Apple’s Legacy… or Saving It : Cheerful
Design is different here.
Framer