Fermer

juin 11, 2021

Utiliser l'audio —


À propos de l'auteur

Fred est rédacteur en chef des compétences générales et du développement professionnel chez Smashing Magazine (pitch him !) et ingénieur logiciel chez The Guardian. Ses intérêts incluent…
En savoir plus sur
Frédéric

Le design tourne souvent autour des visuels, mais les autres sens méritent aussi l'amour. Dans cet article, nous nous intéressons aux fonctionnalités audio qui font chanter les sites.

Il est facile de se concentrer sur l'apparence des choses sur le Web. Il y a beaucoup à regarder. Vous regardez ça en ce moment ! Cependant, à l'ère des écrans tactiles et des assistants à domicile, il est sûr de dire que la vue n'est pas le seul sens dont il faut se soucier.

George Lucas a dit un jour la moitié de la magie d'un film vient de ses sons. On pourrait en dire autant de certaines expériences en ligne. Pour la deuxième partie de cette série, nous avons rassemblé certains de nos exemples préférés de sons utilisés sur le Web. La plupart d'entre nous ont eu la malchance de croiser de mauvais exemples (la lecture automatique de vidéos étant un exemple particulièrement flagrant), mais l'audio peut donner aux expériences Web une toute nouvelle dimension lorsqu'il est bien appliqué.[19659006]Ce qui suit sont quelques sons étonnants du World Wide Web. Nous espérons que ces idées brillantes vous aideront à penser un peu différemment à vos propres projets. une page, avec une certaine marge de manœuvre pour savoir si cette page est sur papier ou sur un écran. D'année en année, cette hypothèse devient de plus en plus restrictive et réductrice. Les mots peuvent être entendus aussi bien que lus. C'est quelque chose sur lequel un nombre croissant de sites Web se tournent, le The New Yorker étant un exemple particulièrement bon. Une grande partie de leurs écrits – fiction et non-fiction – est accompagné d'une version audiosouvent lue par les auteurs eux-mêmes.

Site Internet du New Yorker
Sur Le New Yorkerla version audio des articles est assez pratique pour écouter en déplacement, ou pour rendre ces longues lectures un peu plus accessibles.

La plupart des sites Web n'ont pas le luxe d'enregistrer des personnes comme Margaret Atwood, mais avec le logiciel de synthèse vocale de mieux en mieuxnous aimons voir des sites l'intégrer dans leur conception et leurs fonctionnalités. Nieman Reports a fait un article fantastique sur le sujet l'année dernière, et oui, il existe une version audio.

Branchez-vous sur les radios du monde dans Radio Garden

N'oublions pas que les sites Web peuvent prendre d'autres formes que les grilles. Radio Garden vous fait parcourir les stations de radio du monde en un instant. C'est comme Google Earth, mais avec de la musique. Faites tourner le globe, allumez, connectez-vous, abandonnez. Une idée d'une simplicité trompeuse exécutée avec une élégance ludique.

Le site Web de Radio Garden
Construit à l'origine en 2016, Radio Garden a fait l'objet d'une refonte complète l'année dernière.

Beaucoup de pièces sont nécessaires pour que cela soit possible, parmi eux CesiumJS pour le globe, Esri pour l'imagerie satellite et Free GeoIP pour l'API de localisation. Une idée merveilleuse magnifiquement exécutée. (Une mention honorable doit également aller à Radioooooune sorte d'équivalent du voyage dans le temps.)

Botany And Symphonies In Penderecki's Garden

Nous doutons que vous ayez jamais vu un jardin commémoratif comme Krzysztof Penderecki . Promenez-vous dans le jardin virtuel du légendaire compositeur polonais (et jardinier passionné) avec sa musique en arrière-plan. C'est un bel hommage et une étude de cas passionnante sur la conception de sites Web pour démarrer. Il se passe beaucoup de choses intéressantes, mais la musique semblait être la chose sur laquelle se concentrer.

 Le site Web de Penderecki's Garden
Penderecki's Garden n'est pas tant un site Web qu'un palais de l'esprit virtuel. Immersif, éducatif, élégant… Qui aurait pensé de nos jours qu'Internet pouvait encore sembler si sophistiqué ?

Les histoires orales d'Akkers van Margraten sur la Seconde Guerre mondiale

La possibilité pour les documents d'archives de se réinventer en ligne dans de nouvelles et manières passionnantes est presque illimitée. Le projet d'histoire orale Akkers van Margraten construit son site Web autour de son contenu audio, avec des clips audio accompagnés d'arrangements musicaux lugubres.

Site Web d'Akkers van Margraten
Le site Web déchire le passé. des manuels d'histoire et le rend aussi réel et immédiat qu'il le mérite.

La musique est complémentaire, aidant les personnes interrogées à évoquer l'esprit d'un temps et d'un lieu. L'effet serait-il le même sans ? Nous n'en sommes pas si sûrs.

Netflix apporte une intensité semblable à celle d'une bande-annonce à son guide de la série sombre

Il y a une méfiance envers les médias qui sont lus automatiquement sur les pages Web. Cette méfiance est bien méritée. Pourtant, le guide de la série " Dark" de Netflix montre à quel point il peut être puissant lorsqu'il est bien fait. Les tons ambiants profonds du site vous plongent dans l'ambiance.

La série Dark de Netflix
Il s'agit de petites choses : le son se coupe lorsque vous quittez l'onglet, ce qui ajoute une touche géniale. (Crédits image : Netflix – Dark )

Imaginez un article long avec le bon accompagnement – une histoire d'horreur associée à des arrangements ambiants dissonants peut-être, ou un retour sur les Swinging Sixties avec un avion Jefferson chanson jouée au loin. Ce guide Dark montre à quel point un coup dans le bras peut être.

IT Museum apporte des visites audio sur le Web

Le DataArt IT Museum est un jamais- collection croissante de matériel technologique d'Europe de l'Est, chaque élément étant mis en ligne de manière appropriée. Cet e-musée est beau à bien des égards, mais son utilisation d'extraits d'interviews est particulièrement pointue. Un peu comme Akkers van Margraten, les extraits audio comblent le fossé entre hier et aujourd'hui.

DataArt IT Museum
Les extraits audio s'intègrent parfaitement à l'expérience globale sur le site Web DataArt IT Museum.

Cela semble presque évident une fois que vous le voyez. Presque tout le monde s'est promené dans un musée, une galerie ou un bâtiment historique en écoutant un audioguide. Pourquoi la même option ne serait-elle pas disponible en ligne ?

Ethics For Design

Quel est le rôle d'un designer ? C'est la question posée à une douzaine de designers et de chercheurs dans Ethics for Designavec des réponses présentées d'une manière que seul le web pourrait vraiment apporter. Au lieu de présenter les résultats dans une vidéo ordinaire sur papier glacé, le site sépare plutôt toutes les pièces.

Ethics for Design's website
Sur Ethics for Designvidéo, sous-titres, les photographies, les crédits et l'audio se côtoient, l'utilisateur contrôlant la quantité d'espace occupé par chaque pièce.

Autant que toute autre chose, cela montre combien peut être perdu lorsque nous nous limitons à un seul support – que ce soit du texte, du son, des vidéos, des photographies ou des graphiques. Bien qu'un peu choquant au début, c'est peut-être ce qu'il faut pour réfléchir à la façon dont chaque pièce s'intègre dans un puzzle plus large.

Sticky Music Player Bar de SoundCloud

Nous avons pensé que nous devrions terminer avec une fonctionnalité honnête. Pour cela, on se tourne vers SoundCloudqui possède un lecteur de musique qui joue indépendamment du reste du site. Cliquer sur une nouvelle page ne réinitialise pas le lecteur, permettant aux visiteurs de parcourir les artistes et les albums sans interrompre le flux de ce qu'ils écoutent. Cela semble si naturel qu'il est difficile d'imaginer qu'il n'y en ait pas.

Le site Web de SoundCloud
Soundcloud permet à l'utilisateur de faire des choses simultanément.

Nous sommes devenus. habitué à cela via des applications comme Spotify, mais sur le Web proprement dit, il crie toujours un potentiel inexploité. Pensez à la façon dont il pourrait être combiné avec d'autres idées présentées ici. Imaginez que vous êtes sur un site d'actualités et que vous commencez à écouter une histoire, à la The New Yorker. Avec un lecteur comme celui-ci, les visiteurs pouvaient continuer à naviguer sur le site tout en écoutant l'histoire originale. Cela ressemble à l'avenir.

Conclusion

Les sites présentés ici ne font qu'effleurer la surface de ce qui est possible. Le son peut prendre d'innombrables formes : radio, lecteurs de musique, interviews, narration et navigation pour n'en citer que quelques-unes. Nous ne sommes pas si loin de converser avec des sites Web.

Si vous souhaitez en savoir plus, les articles ci-dessous offrent un bon point de départ pour la conception audio en ligne :

Les capacités techniques ont grandi massivement ces dernières années, avec de plus en plus de flexibilité exigée des sites que nous utilisons. On les voit, on les touche et, de plus en plus, on les entend. Nous n'allons pas plaider pour des sites Web comestibles et agréablement parfumés (pour l'instant), mais parfois cela vaut vraiment la peine de les rendre plus bruyants.

Smashing Editorial" width="35" height="46" loading="lazy" decoding="async (vf, yk, il)




Source link