What do you think?
Rate this book
Refactoring UI
Make your ideas look awesome, without relying on a designer. Learn how to design beautiful user interfaces by yourself using specific tactics explained from a developer's point-of-view.
252 pages, ebook
Published December 11, 2018
314 people are currently reading
4907 people want to read
Ratings & Reviews
Friends & Following
Create a free account to discover what your friends think of this book!
Community Reviews
Displaying 1 - 30 of 294 reviews
April 13, 2019
I literally read this in 2 hours.
November 21, 2020
A message to my younger, experimental person who thought you mostly learn by doing:
Read this first. You would have a boosted run.
Read this first. You would have a boosted run.
January 20, 2019
This book is great but it’s aimed primarily at developers who are looking to improve their UI designs when there’s no designer on a project (or similar situation). For that audience, it’s perfect. For designers coming from a primarily print background, I’d recommend this book in a heartbeat. As for the seasoned web or UI design veteran... a lot of it is stuff you’ll likely already know. But I found at least a couple of practical tips that I’m definitely going to include in my design toolbox and workflow.
January 5, 2019
بحكم أنني مُبرمج واجهة خلفية (باك إند) فإن من عادتي أن أستهلك وقتًا كبيرًا في بناء واجهات تطبيقات الويب التي أطلقها ما بين الحين والآخر. ورغم كل الوقت الذي أقضيه معها (والذي عادة ما يُعادل أو يتجاوز الوقت الذي أقضيه في الواجهة الخلفية) إلّا أن النتيجة النهائية لا تكون بالإتقان أو الجمال الذي أرغب فيه، ربما لأنني لا أحب العمل على الفرونت إند (أميل أكثر إلى اعتبارها برمجة من "درجة أقل" مقارنة مع الواجهات الخلفية) وقد يكون لعدم إلمامي بالقواعد الأساسية وبأفضل المُمارسات في هذا المجال دورًا كبيرًا في هذا الأمر.
بالرغم أن تصميم واجهات مُستخدم احترافية يعتمد كثيرًا على الحس الفنّي للمُصمم/المُطوّر إلّا أن الإلمام بتلك القواعد الأساسية والاطلاع على أفضل المُمارسات في هذا الجانب كفيل على الأقل بأن يجعل واجهاتك لا تظهر بمظهر يدلّ على قلّة خبرة/حيلة مُصمّما وأن يسمح لك بتحسين واجهاتك بشكل كبير. هذا الكتاب يجمع خبرة الكاتبين في هذا المجال وتقدميها في كتاب سهل "الاستهلاك" مع العشرات من الأمثلة مما يجب ولا يجب القيام به.
الكتاب مُقسّم إلى 8 فصول تستعرض مُختلف الجوانب التي ستحتاجها لدى بناء تطبيقات الويب الخاصة بك مثل تصميم النماذج واختيار الألوان والخطوط والاستخدام الأمثل للمساحات البيضاء ونسبية العناصر بعضها إلى بعض، كما يتطرّق إلى حسن اختيار الألوان والطريقة الأمثل للتعامل مع الصور، خاصّة تلك التي يرفعها المُستخدم إلى تطبيقك والتي لا تكون في أغلب الحالات مثالية.
مُرفق مع الكتاب ملفات تتعلّق بكيفية اختيار لوحة ألوان والخطوط إضافة إلى مجموعة من الأيقونات التي يُمكن لك استخدامها في تطبيقاتك. كما تم إرفاق 3 فيديوهات تتعلق بتصميم نماذج مُعقّدة، تصميم لوحات التّحكم وتصميم صفحات مُحتوى بشكل احترافي ومن الصفر.
إن لم يُقنعك الوصف السابق لقراءة الكتاب فإن الفيديو التالية ستقنعك لا محالة
https://vimeo.com/305601486/a1388ac3a9
الكتاب مُرتفع السعر ، رغم ذلك إن استطعت الحصول عليه فإنّك ستستفيد لا محالة منه. بعبارة أخرى أنصح بقراءة هذا الكتاب كل من يعمل في مجال تطوير تطبيقات الويب خاصّة ممن ليس لديهم حس فني يسمح لهم
بتصميم واجهات مُستخدم جميلة.
يُمكنك الحصول على الكتاب وقراءة بعض المُقتطفات منه على موقعه: https://refactoringui.com/
بالرغم أن تصميم واجهات مُستخدم احترافية يعتمد كثيرًا على الحس الفنّي للمُصمم/المُطوّر إلّا أن الإلمام بتلك القواعد الأساسية والاطلاع على أفضل المُمارسات في هذا الجانب كفيل على الأقل بأن يجعل واجهاتك لا تظهر بمظهر يدلّ على قلّة خبرة/حيلة مُصمّما وأن يسمح لك بتحسين واجهاتك بشكل كبير. هذا الكتاب يجمع خبرة الكاتبين في هذا المجال وتقدميها في كتاب سهل "الاستهلاك" مع العشرات من الأمثلة مما يجب ولا يجب القيام به.
الكتاب مُقسّم إلى 8 فصول تستعرض مُختلف الجوانب التي ستحتاجها لدى بناء تطبيقات الويب الخاصة بك مثل تصميم النماذج واختيار الألوان والخطوط والاستخدام الأمثل للمساحات البيضاء ونسبية العناصر بعضها إلى بعض، كما يتطرّق إلى حسن اختيار الألوان والطريقة الأمثل للتعامل مع الصور، خاصّة تلك التي يرفعها المُستخدم إلى تطبيقك والتي لا تكون في أغلب الحالات مثالية.
مُرفق مع الكتاب ملفات تتعلّق بكيفية اختيار لوحة ألوان والخطوط إضافة إلى مجموعة من الأيقونات التي يُمكن لك استخدامها في تطبيقاتك. كما تم إرفاق 3 فيديوهات تتعلق بتصميم نماذج مُعقّدة، تصميم لوحات التّحكم وتصميم صفحات مُحتوى بشكل احترافي ومن الصفر.
إن لم يُقنعك الوصف السابق لقراءة الكتاب فإن الفيديو التالية ستقنعك لا محالة
https://vimeo.com/305601486/a1388ac3a9
الكتاب مُرتفع السعر ، رغم ذلك إن استطعت الحصول عليه فإنّك ستستفيد لا محالة منه. بعبارة أخرى أنصح بقراءة هذا الكتاب كل من يعمل في مجال تطوير تطبيقات الويب خاصّة ممن ليس لديهم حس فني يسمح لهم
بتصميم واجهات مُستخدم جميلة.
يُمكنك الحصول على الكتاب وقراءة بعض المُقتطفات منه على موقعه: https://refactoringui.com/
July 20, 2019
I love this book, because it doesn't mess around: there's a title page, the table of contents, and then you're immediately presented with some great design advice:
That's the title of the first section of the first chapter of this book. The authors explain that design is different from aesthetics. When you're developing a product like an app or a website, the most important thing is that it's functional. Decide what UI elements you need to satisfy that functionality first, then build your product around it. Google's home page contains little more than a single search box, but it's one of the most popular websites on the Internet.
I feel like I can't accurately summarise this book in a review because every sentence is brimming with great design tips. The book is only about 200 pages long and -- because there are a lot of graphics -- you can easily read it in a few hours in a single afternoon. It feels like sitting down for a chat with an experienced web developer and listening to them explain every bit of design advice they've accrued over their career.
This book has helped me put into words what I think is the most important piece of design advice anyone could give, and that is: "be consistent". Not "consistent" in the sense that everything has to always be the same, but in the sense that you should pick a few different fonts, a few different colours, and so on, and use them the same way in the same contexts.
The authors call this a "visual hierarchy" and recommend that you develop it ahead of time so you you're not constantly fretting over minute design details as you develop your website or app. Pick 2-3 shades of a colour for emphasised, normal, and de-emphasised text. Use a heavier font weight to emphasise important information. Pick a colour scheme and stick with it. Use whitespace judiciously. Steer clear of relative sizing.
In my humble opinion, the two biggest "tells" of someone who's not design-minded are:
1. inconsistent or inappropriate spacing
2. inconsistent layout
I can't tell you how important it is for your company logo to be in the same place on every page of your website, or every slide of your Powerpoint presentation (excepting maybe the home page / title slide). It looks unprofessional (dare I say "sloppy"?). This book emphasises these points and more.
As I said, it's difficult to summarise this book in a few sentences. If you're interested in visual design, especially web design, I promise that you will not be able to put this book down. I would recommend it to anyone working in UI/UX, frontend development, or web or mobile design. Actually, I would recommend it to anyone who has ever had to lay out a report, make a slide deck, or design a brochure. There are certain rules of design that transcend media and this book provides a great foundation for designing professional-looking products. 100% Recommended.
"Start with a feature, not a layout"
That's the title of the first section of the first chapter of this book. The authors explain that design is different from aesthetics. When you're developing a product like an app or a website, the most important thing is that it's functional. Decide what UI elements you need to satisfy that functionality first, then build your product around it. Google's home page contains little more than a single search box, but it's one of the most popular websites on the Internet.
I feel like I can't accurately summarise this book in a review because every sentence is brimming with great design tips. The book is only about 200 pages long and -- because there are a lot of graphics -- you can easily read it in a few hours in a single afternoon. It feels like sitting down for a chat with an experienced web developer and listening to them explain every bit of design advice they've accrued over their career.
This book has helped me put into words what I think is the most important piece of design advice anyone could give, and that is: "be consistent". Not "consistent" in the sense that everything has to always be the same, but in the sense that you should pick a few different fonts, a few different colours, and so on, and use them the same way in the same contexts.
The authors call this a "visual hierarchy" and recommend that you develop it ahead of time so you you're not constantly fretting over minute design details as you develop your website or app. Pick 2-3 shades of a colour for emphasised, normal, and de-emphasised text. Use a heavier font weight to emphasise important information. Pick a colour scheme and stick with it. Use whitespace judiciously. Steer clear of relative sizing.
In my humble opinion, the two biggest "tells" of someone who's not design-minded are:
1. inconsistent or inappropriate spacing
2. inconsistent layout
I can't tell you how important it is for your company logo to be in the same place on every page of your website, or every slide of your Powerpoint presentation (excepting maybe the home page / title slide). It looks unprofessional (dare I say "sloppy"?). This book emphasises these points and more.
As I said, it's difficult to summarise this book in a few sentences. If you're interested in visual design, especially web design, I promise that you will not be able to put this book down. I would recommend it to anyone working in UI/UX, frontend development, or web or mobile design. Actually, I would recommend it to anyone who has ever had to lay out a report, make a slide deck, or design a brochure. There are certain rules of design that transcend media and this book provides a great foundation for designing professional-looking products. 100% Recommended.
April 18, 2019
I want every tech book to be that good.
October 27, 2019
Best book on UI/UX design. Great re-read value as well. Helped me clear a lot of fundamentals for designing good UIs without needing a designer.
December 13, 2018
An excellent primer on how to make simple design decisions that could greatly improve your designs. No fluff; 100% signal, 0% noise.
May 24, 2020
They charge an absurd price for what is essentially a collection of blog posts. I do not know how people are okay with being charged so much for such a shallow tutorial.
August 27, 2024
This is a great resource for software developers who work on UIs; it provides clear, useful advice without any fluff.
(Thank you Daniel for the excellent suggestion to dig up my literary past. So far my integrity is intact!)
(Thank you Daniel for the excellent suggestion to dig up my literary past. So far my integrity is intact!)
December 22, 2022
That book made even me feel like I could design something
October 31, 2024
As a former designer, and still a webdev, this book isn‘t really about UI design, but more about component design & layout. It’s not gonna help you design coherent interfaces.
The information on White Space, font weights & -sizes is good & practical. The color section is underwhelming. For non-designers there are some great pointers like how & why to break out of 12 column grids.
All-in-all a bit unbalanced, but it works ok as a basic inspirational tool of you wa,t your app or site to look like most otter apps or sites.
So, it’s not too bad, but hefty overpriced.
If you don’t have a design background, this will help you design better apps. If you do have a design background, this is a < 1 hour read: ok to brush up your knowledge , a few good pointers here and there, but I already mentioned it: way too expensive.
3.5 stars
YMMV
The information on White Space, font weights & -sizes is good & practical. The color section is underwhelming. For non-designers there are some great pointers like how & why to break out of 12 column grids.
All-in-all a bit unbalanced, but it works ok as a basic inspirational tool of you wa,t your app or site to look like most otter apps or sites.
So, it’s not too bad, but hefty overpriced.
If you don’t have a design background, this will help you design better apps. If you do have a design background, this is a < 1 hour read: ok to brush up your knowledge , a few good pointers here and there, but I already mentioned it: way too expensive.
3.5 stars
YMMV
February 12, 2019
I'm starting to realize that as a front-end developer, I had no idea of designing UI's before. It explains it's ideas with nice examples and sketches and also, for example, gave me nice approach in using white space in my designs: "A better approach is to start by giving something way too much space, then remove it until it you’re happy with the result." It may seem simple but I wasn't aware how much this can help me. I would recommend it to you if you are a developer or a junior product owner/manager for a better understanding of designing web pages without a designer.
January 6, 2023
This book made me going from having absolutely no clue to feeling confident in trying to implement some own design ideas.
They have a lot of great examples on almost anything they write and it is immediately graspable what they mean. They also provide a ton of resources for color palettes, components etc.
I appreciate it a lot to have resources from people like Adam Wathan. Adam is the Inventor of TailwindCSS, the leading CSS styling framework which is used super widely.
It's also worth a read for non-development people and everyone who is interested in how to make designs better :)
They have a lot of great examples on almost anything they write and it is immediately graspable what they mean. They also provide a ton of resources for color palettes, components etc.
I appreciate it a lot to have resources from people like Adam Wathan. Adam is the Inventor of TailwindCSS, the leading CSS styling framework which is used super widely.
It's also worth a read for non-development people and everyone who is interested in how to make designs better :)
January 19, 2020
Awesome book!
I highly recommend it for UI/UX and Web designer, and also for backend developer who want to learn some quick tips to make thiers own UIs feel designed and well organized.
Me as a backend developer, sometimes when I need to build some frontend for my APIs, I often waste time making decisions like : what perfect color to pick, what font-family to choose, how to position headlines, etc. I think this book will help me a lot :)
I highly recommend it for UI/UX and Web designer, and also for backend developer who want to learn some quick tips to make thiers own UIs feel designed and well organized.
Me as a backend developer, sometimes when I need to build some frontend for my APIs, I often waste time making decisions like : what perfect color to pick, what font-family to choose, how to position headlines, etc. I think this book will help me a lot :)
March 25, 2020
Concise guide to User Interfaces. Really helped me as a non-designer.
June 24, 2025
very practical and actionable! would recommend for anyone interested in getting the basics of good UI and habits. I would think that a seasoned professional may glean a couple things from this book as well, but for them it's probably mostly things that are intuitive at that point.
I still need to go through the videos. I do wish there were more code snippets for different recommendations, though the book does include css in just about every section.
I still need to go through the videos. I do wish there were more code snippets for different recommendations, though the book does include css in just about every section.
January 7, 2019
Thought this one was great. Good, hands on advice on how you can bring your designs to the next level, will definitely go back to this one!
September 14, 2019
Tonnes of good practical tips
January 15, 2024
espectacular, me siento unai.
November 9, 2025
Holy 250-paged UI bible, filled with good advice and concrete tips for clean webdesign
December 21, 2024
Refactoring UI is quite good. I would recommend it to anyone who wants to understand design better.
April 3, 2021
I have been working on building new interfaces usually involving a solid research for every single detailing done on the designs. This book gives you curated such researches to rely on that works well and serves the purpose.
Tips, tricks and good amount of foundation knowledge is what you get in this book, explained in simple langauge.
Tips, tricks and good amount of foundation knowledge is what you get in this book, explained in simple langauge.
October 17, 2021
I like it!
May 18, 2022
I've followed the authors' work on YouTube, Dribble, and similar platforms over the last months and finally committed the time to go through this book.
Overall it's a short read (a few hours), and doesn't bring much more to the table than all the great resources already out there.
I can definitely recommend looking into material such as
https://m.youtube.com/playlist?list=P...
and looking into the two author's conference talks. Their Dribble pages are good inspiration, too.
To see constrained design systems in action, I can recommend checking out https://www.pollen.style and the design tokens in Tailwind CSS.
With all these free and open resources out there, the book really was a quick read for me and mainly rehashed what the authors already taught me through open resources. Overall very education for anyone who wants to learn about display-first design nowadays.
Overall it's a short read (a few hours), and doesn't bring much more to the table than all the great resources already out there.
I can definitely recommend looking into material such as
https://m.youtube.com/playlist?list=P...
and looking into the two author's conference talks. Their Dribble pages are good inspiration, too.
To see constrained design systems in action, I can recommend checking out https://www.pollen.style and the design tokens in Tailwind CSS.
With all these free and open resources out there, the book really was a quick read for me and mainly rehashed what the authors already taught me through open resources. Overall very education for anyone who wants to learn about display-first design nowadays.
November 11, 2020
Overall a super light and quick read! Adam Wathan was able to manifest a lot of concepts I felt like I intuitively already knew beforehand into very quantitative and specific examples. Instead of having a gut feeling that a space is too busy, he puts into words and diagrams why exactly that may be. Another big takeaway is the reoccurring theme of creating systems in the designs you're wishing to implement - whether it's in shadows, colours, or typography.
It's definitely targeted towards specific visual design elements but has so many great tips I think it'd make for a good re-read in the future. :)
It's definitely targeted towards specific visual design elements but has so many great tips I think it'd make for a good re-read in the future. :)
This entire review has been hidden because of spoilers.
September 20, 2020
This is a really good book.
Because:
-lots of practical and specific tips and tricks to improve visual designs
- a beautiful, soothing layout
- easy to read language
- good reasoning and fundamentals about many of the 'tips'
I wish I had read a book like this 5 years ago.
(This one came out in 2018)
The authors know what they are talking about. Visual design can feel overwhelming because blank pages are overwhelming, and everyone is an expert on what looks good to them.
If your work/passion involves design for web-based products, go for it.
Because:
-lots of practical and specific tips and tricks to improve visual designs
- a beautiful, soothing layout
- easy to read language
- good reasoning and fundamentals about many of the 'tips'
I wish I had read a book like this 5 years ago.
(This one came out in 2018)
The authors know what they are talking about. Visual design can feel overwhelming because blank pages are overwhelming, and everyone is an expert on what looks good to them.
If your work/passion involves design for web-based products, go for it.
April 3, 2021
I wish I would have read this book sooner. It's a quick read (say, half a day) and contains lots of practical advice on how to design beautiful user interfaces. If you are a PM or front-end developer, who thinks of themselves as "being bad at design", this book is a must-read.
Some sample advice: Build your design system first and choose within those boundaries while designing to avoid decisions fatigue. "Painfully trialing arbitrary values one pixel at a time will drastically slow you down at best, and create ugly, inconsistent designs at worst. [...] [This] will help you create better designs, with less effort, in less time. Design advice doesn’t get much more valuable than that."
Some sample advice: Build your design system first and choose within those boundaries while designing to avoid decisions fatigue. "Painfully trialing arbitrary values one pixel at a time will drastically slow you down at best, and create ugly, inconsistent designs at worst. [...] [This] will help you create better designs, with less effort, in less time. Design advice doesn’t get much more valuable than that."
May 20, 2021
This is a great book for mostly developers, but there's a lot to learn in there for anyone who's interested in creating a great design. I've been following Steve Schoger over twitter and seen him work on quick do-overs on not-so-great-looking UIs and turn them to better looking and effective interfaces. He's collaborated with Adam Wathan to bring out a great guide that is easy to comprehend. This book clearly shows where you are going wrong, how to improve your thinking process behind a design along with a couple of more effective options.
January 9, 2023
I recently read Refactoring UI and was blown away by how useful it was. The book is very practical and easy to follow, with clear explanations and examples to illustrate key points. It also does an excellent job of explaining the principles that underlie good UI design, which really helped me to understand why certain design choices are better than others. Overall, I highly recommend this book to anyone looking to improve their UI design skills. It has already had a huge impact on my work, and I'm sure it will do the same for others.
Displaying 1 - 30 of 294 reviews