|
| 1 | +# Design Philosophy {#design-philosophy} |
| 2 | + |
| 3 | +The elementary OS HIG isn't just about a set of concrete rules; it's meant to be flexible and extensible. As such, this very first portion of the guideline is all about the guiding philosophy we employ. For a quick crash course, we like "The User is Drunk": |
| 4 | + |
| 5 | +<iframe width="560" height="315" src="https://www.youtube.com/embed/r2CbbBLVaPk?rel=0" frameborder="0" allowfullscreen></iframe> |
| 6 | + |
| 7 | +## What Design Is Not {#what-design-is-not} |
| 8 | + |
| 9 | +Before we get into all the things that make up elementary OS apps, there is a clarification that needs to be made. We need to understand what exactly design is about, but more importantly we want to smash two major myths: |
| 10 | + |
| 11 | +1. **Design is not something you add on after you've completed a product.** Whether you realize it or not, you are constantly designing anything you build. It is an intrinsic part of creating something. Design is not just what something looks like. It's not just the colors and fonts. Design is how it works. When you decide to add a button that does a thing, that is design. You made a decision to add a button with an icon or a label and where that button went and the size and color of that button. Decisions are designs. |
| 12 | + |
| 13 | +2. **Design is not just, like, your opinion, man.** Design is testable. One design will meet a specific goal better than another design. Consider different types of bicycles. A folding bicycle has a different set of design goals than a mountain bicycle. Things like weight, size, and tire tread are important factors in helping the intended user reach their goals. Because we understand that design is about solving specific problems, we must also understand that we can objectively compare the effectiveness of two designs at solving those problems. |
| 14 | + |
| 15 | +------------------------------------------ |
| 16 | +1. [Design Is Not Veneer, Aral Balkan](https://ar.al/notes/design-is-not-veneer/) |
| 17 | +2. [Design is Not Subjective, Jeff Law](https://web.archive.org/web/20181208131017/http://www.jefflaw.ca/design-is-not-subjective/) |
| 18 | + |
| 19 | +## Concision {#concision} |
| 20 | + |
| 21 | +Always work to make your app instantly understandable. The main function of your app should be immediately apparent. You can do this in a number of ways, but one of the best ways is by sticking to a principal of concision. |
| 22 | + |
| 23 | +### Avoid Feature Bloat {#avoid-feature-bloat} |
| 24 | + |
| 25 | +It's often very tempting to continue adding more and more features into your application. However, it is important to recognize that every new feature has a price. Specifically, every time you add a new feature: |
| 26 | + |
| 27 | +* Your application gets slower, consumes more resources, and takes up more disk space. |
| 28 | +* Your application's interface becomes more cluttered and thus harder to use. |
| 29 | +* More time is spent implementing this new feature, rather than perfecting an old feature. |
| 30 | +* More code can often mean a greater possibility for bugs. |
| 31 | +* More features means more work on documentation, translations, etc. |
| 32 | + |
| 33 | +### Think in Modules {#think-in-modules} |
| 34 | + |
| 35 | +Build small, modular apps that communicate well. elementary OS apps avoid feature overlap and make their functions available to other apps either through [Contractor](#contractor) or over [D-Bus](https://www.freedesktop.org/wiki/Software/dbus/ "View D-Bus docs from FreeDesktop.Org"). This both saves you time as a developer (by other apps making their functions available to you), and is a courteous gesture towards other developers (by making your app's functions available to them). |
| 36 | + |
| 37 | +<span id="avoid-configuration"/> |
| 38 | + |
| 39 | +## Accessible Configuration {#accessible-configuration} |
| 40 | + |
| 41 | +Providing settings can be a way to make sure an app is accessible to a wider set of users with special needs, but it can also be an easy way out of making design decisions about an app's behavior. Just like with problems of feature bloat, settings mean more code, more bugs, more testing, more documentation, and more complexity. When considering adding options to your app, try to strike a balance of making your app more accessible without pushing design work onto your users. |
| 42 | + |
| 43 | +### Build for the "Out of The Box" Experience {#build-for-the-out-of-the-box-experience} |
| 44 | + |
| 45 | +Design with sane defaults in mind. elementary OS apps put strong emphasis on the out of the box experience. If your app has to be configured before a user is comfortable using it, they may not take the time to configure it at all and simply use another app instead. |
| 46 | + |
| 47 | +<iframe width="560" height="315" src="https://www.youtube.com/embed/WD-G6ns8oDU" frameborder="0" allowfullscreen></iframe> |
| 48 | + |
| 49 | +### Ask the Operating System {#ask-the-operating-system} |
| 50 | + |
| 51 | +Get as much information automatically as possible. Instead of asking a user for their name or their location, ask the system for this information. This cuts down on the amount of things a user has to do and makes your app look intelligent and integrated. |
| 52 | + |
| 53 | +<span id="do-you-really-need-it"/> |
| 54 | + |
| 55 | +### Is It Really About Accessibility? {#is-it-really-about-a11y} |
| 56 | + |
| 57 | +Ask yourself if the configuration option you are adding is really necessary to make your app more accessible or if it makes sense to have a user make this decision. Don't ever ask users to make uninformed engineering or design decisions. |
| 58 | + |
| 59 | +### When You Absolutely Have To {#when-you-absolutely-have-to} |
| 60 | + |
| 61 | +Keep things contextual. Instead of tucking away preferences in a configuration dialog, think about displaying them in context with the objects they affect (much like how shuffle and repeat options appear near your music library). |
| 62 | + |
| 63 | +If your app needs to be configured before it can be used (like a mail client), present this configuration inside the main window much like a [Welcome Screen](#welcome-screen). Once again, make sure this is really necessary set-up. Adding unnecessary configuration screens stops users from doing what they wanted to do when they opened your app in the first place. |
| 64 | + |
| 65 | +--------------------------- |
| 66 | +See Also: |
| 67 | + |
| 68 | +1. [Checkboxes That Kill Your Product](https://limi.net/checkboxes) by Alex Limi |
| 69 | +2. [Don't Give Your Users Shit Work](https://zachholman.com/posts/shit-work/) by Zach Holman |
| 70 | +3. [The Wizard Anti-Pattern](http://stef.thewalter.net/installer-anti-pattern.html) by Stef Walter |
| 71 | + |
| 72 | +## Minimal Documentation {#minimal-documentation} |
| 73 | + |
| 74 | +Most users don't want to read through help docs before they can use your app. Instead, they expect that your app will be intuitive and simple for them to understand without assistance. |
| 75 | + |
| 76 | +[](https://xkcd.com/1343/) |
| 77 | + |
| 78 | +### Use Understandable Copy {#use-understandable-copy} |
| 79 | + |
| 80 | +Avoid technical jargon and assume little-to-no technical knowledge. This lets your app be "self-documenting." |
| 81 | + |
| 82 | +Provide non-technical explanations instead of cryptic error messages. If something goes wrong, a simplified explanation of what happened and how to fix it should be presented. |
| 83 | + |
| 84 | +------------------------------------------ |
| 85 | + |
| 86 | +For more information, see [Writing Style](#writing-style). |
0 commit comments