Secret de forme d'icône IOS: est-ce qu'il éjacule? Analyse

Jouons à un jeu. Nous avons deux rangées d'icônes familières à tous les utilisateurs iOS. À première vue, les icônes ci-dessus et ci-dessous sont les mêmes. Mais ce n'est pas le cas. Dans une rangée, vous voyez de vraies icônes et dans l'autre un faux. Pouvez-vous identifier où lesquels? Prenez votre temps, regardez attentivement? Eh bien, avez-vous choisi? Les vraies icônes sont en haut. Je pense que beaucoup d'entre vous ont remarqué que quelque chose ne va pas avec les icônes inférieures. Pour une raison quelconque, leur forme semble bâclée, comme si un pixel supplémentaire avait été coupé quelque part. Pourquoi ça arrive? Le fait est que les fausses icônes en forme sont des carrés aux coins arrondis, et un rectangle si l'on parle d'un fond gris. Mais! L'interface iOS n'a pas un seul carré arrondi. Tous les éléments dans iOS ne sont pas des carrés et des rectangles - ce sont des superellipses!



























Aujourd'hui, nous allons parler des secrets dans la conception des produits Apple. Qu'est-ce qu'une superellipse? Quelle est la magie de la forme des icônes? Et pourquoi HomePod est un super œuf.











Les produits Apple sont souvent incohérents et défectueux. Mais je pense que personne ne dira qu'en termes de design, Apple est probablement le plus dérangeant du marché. Et même la forme des icônes dans iOS n'est pas prise au plafond, mais calculée mathématiquement.



On l'appelle une superellipse ou courbe de Lame, du nom du mathématicien Gabriel Lame, qui au XIXe siècle a grandement contribué à la théorie de l'élasticité, a développé la théorie générale des coordonnées curvilignes et inventé les superellipses. Qu'Est-ce que c'est?



Il s'agit d'une courbe géométrique construite à l'aide d'une équation comme celle-ci: Cette équation définit une courbe fermée délimitée par un rectangle. En même temps, en changeant la valeur de n, on peut ajuster le degré de convexité de chaque coin ( vous pouvez jouer ici







). Lorsque n est inférieur à un, nous obtenons des côtés concaves et la forme ressemble à une étoile. À mesure que n augmente, la forme devient de plus en plus convexe. Pour n = 2, un cercle pair est obtenu. Et avec n égal à 4 ou 5, nous obtenons la forme d'icône familière à tout le monde. Cette forme a même son propre nom - squirkle. Et non, éjaculer n'est pas votre section préférée sur PornHub. Il est dérivé du carré et du cercle. Ceux. en russe squirkl est un cercle carré ou un cercle carré. Soit dit en passant, la formule décrivant icône iOS ressemble à ceci: C'est, une icône sous iOS n'est ni un cercle ni un carré, mais mathématiquement, c'est quelque chose entre les deux.





























Anneau et super oeuf



Référence historique. Le scientifique danois Pete Hein a popularisé les superellipses et les squirkles. Dans les années 60, il conçoit l'anneau de transport de Stockholm comme une superellipse avec les valeurs n = 2,5, a / b = 6/5. La forme de la jonction a été un succès. Et il a commencé à faire des tables, des plats, mais le summum de sa créativité était le super œuf. Comme vous pouvez l'imaginer, il s'agit d'une superellipse en trois dimensions, en forme d'œuf. À propos, les superellipses 3D sont des superellipsoïdes. Et tous les superellipsoïdes irréguliers sont des superquadriques.

















Continuité de courbure



Mais revenons aux icônes! En quoi un cercle carré diffère-t-il d'un carré arrondi? Et comment a-t-il déplu aux designers Apple? Jetons un coup d'oeil!



Si nous comparons les vraies icônes avec les fausses, nous verrons que l'arrondi du cercle carré commence plus tôt et le degré d'arrondi augmente progressivement. Ceci peut être mieux visualisé en utilisant ces arêtes de courbure. Il semblerait que la différence soit de quelques pixels. Mais des transitions douces vous permettent d'obtenir la soi-disant continuité de courbure. Et cela donne un effet étonnant - la forme d'un objet artificiel, comme assemblé à partir de différentes formes, devient naturelle et complète. C'est pourquoi Apple est très actif dans l'utilisation des superellipses non seulement dans l'interface, mais également dans la conception de tous ses produits.

































Mac Mini, Apple TV, iPhone, iPad, MacBook et bien sûr HomePod sont toutes des sortes de superellipses. Même leur nouveau campus n'a pas un seul mur droit.



La fluidité des formes et l'absence de transitions brusques rendent les produits Apple non seulement attrayants en apparence. Il y a un excellent article de Nikolai Gellar à ce sujet, que je citerai:



Plutôt que de nous rappeler les chaînes d'approvisionnement industrielles, les chaînes de montage et les laboratoires chimiques, ces formes plus douces rappellent la beauté de la nature. Il se sent organique et se sent bien.



Par exemple, si nous comparons HomePod et Yandex.Station par conception, il devient clair pourquoi la station semble moins attrayante, comme si elle venait de sortir de l'usine. Et HomePod semblait avoir trouvé un maître japonais du suiseki - l'art d'admirer les pierres - dans son jardin. Bien que Yandex.Station lui-même soit un excellent appareil. Et HomePod est beau, mais terne (ne sait pas le russe).













Exemples de



Mais, bien sûr, Apple n'y est pas venu tout de suite non plus. Par exemple, les icônes et autres éléments d'interface sont devenus des superellipses à partir d'iOS 7. La même histoire avec l'Apple Watch. Dans la série 4, non seulement l'affichage a été agrandi, mais aussi la forme a été mise à jour. Oui, l'Apple Watch de la quatrième version est aussi une superellipse (comme l'écran lui-même).

















Les autres entreprises



Naturellement, non seulement Apple joue avec les superellipses. Les mêmes icônes dans One UI sur les smartphones Samsung, des cercles carrés beaucoup plus évidents qu'Apple. Mais, à mon avis, le formulaire sélectionné ne fonctionne pas pour Samsung.



Premièrement, parce que les icônes sont trop arrondies, ce qui les rend instables, comme si à tout moment elles pouvaient sortir du bureau. À propos, dans le monde physique, la colonne de Mail.ru fait la même erreur, elle est simplement instable. Mais ce n'est pas la chose la plus importante. Le principal problème est l'interface de Samsung. Je parle d'un manque d'unité. Superellipses lisses ici côte à côte avec des rondes rugueuses. À la fois à l'intérieur de l'interface et dans la conception des appareils eux-mêmes.















À savoir, l'unité d'approche, de l'élément d'interface le plus simple à la conception de l'ensemble de la gamme de produits, rend les appareils Apple si attrayants et réactifs à l'utilisation. Oui, cela sonne probablement de la publicité. Mais je m'en fiche, je veux juste rendre hommage à l'approche méticuleuse des gars de Cupertino.



Ces mecs ont montré au monde que non seulement les voitures et les produits de luxe peuvent être beaux, mais aussi les ordinateurs portables et les téléphones ordinaires. Par conséquent, tout l'équipement a maintenant l'air si cool.



All Articles