Différences entre versions de « Communication »

De Mi caja de notas

(Page créée avec « Dans le contexte indieweb cette page a démarré sur iwc:communication et migrera après traduction sur iwc:communication-fr pour façonner un premier essai de car... »)
 
 
(7 versions intermédiaires par 2 utilisateurs non affichées)
Ligne 1 : Ligne 1 :
−
Dans le contexte indieweb cette page a démarré sur [[iwc:communication]] et migrera après traduction sur [[iwc:communication-fr]] pour façonner un premier essai de carte de visite
+
{{stub-fr}}
  
−
''Cette page a démarré sur [[communication]]''
+
<q>Cette page a démarré sur [[iwc:communication]]
−
 
 
−
 
 
−
{{stub-fr}}
 
  
 
La '''<dfn>communication</dfn>''' dans le contexte de l'indieweb fait référence à l'utilisation de votre site personnel comme un point de départ et un moyen potentiel pour que les personnes vous <dfn>contactent</dfn>.
 
La '''<dfn>communication</dfn>''' dans le contexte de l'indieweb fait référence à l'utilisation de votre site personnel comme un point de départ et un moyen potentiel pour que les personnes vous <dfn>contactent</dfn>.
  
−
== Comment ==
+
== Comment faire ==
 
=== Faites de votre page d'accueil un écran d'accueil amical ===
 
=== Faites de votre page d'accueil un écran d'accueil amical ===
 
Ajoutez un [[icon-fr|icône]] pour votre site personnel afin que les autres puissent ajouter votre site à leurs écrans d'accueil sur leurs appareils.
 
Ajoutez un [[icon-fr|icône]] pour votre site personnel afin que les autres puissent ajouter votre site à leurs écrans d'accueil sur leurs appareils.
  
 
=== Ajouter une carte de contact ===
 
=== Ajouter une carte de contact ===
−
Placez une [[h-card-fr|h-card]] sur votre page d'accueil avec des liens vers les moyens avec lesquels vous souhaitez être contacté, dans votre ordre de préférence.
+
Déposez [[h-card-fr|h-card]] sur votre page d'accueil avec des liens vers les moyens avec lesquels vous souhaitez être contacté.e, dans votre ordre de préférence.
  
 
=== Ajouter une interface de contact ===
 
=== Ajouter une interface de contact ===
−
Mettez cette h-card sur une page <samp>/contact</samp> séparée sur votre site Web, par exemple sur vous.exemple.com/contact avec :
+
Posez cette h-card sur une page <samp>/contact</samp> séparée sur votre site Web, par exemple sur princesse.com/contact avec :
 
# des icônes facilement reconnaissables/cliquables pour chaque lien vers un moyen de vous contacter.
 
# des icônes facilement reconnaissables/cliquables pour chaque lien vers un moyen de vous contacter.
−
# En option : montrer conditionnellement /cacher les moyens de vous contacter en fonction de :
+
# En option : montrer conditionnellement/cacher les moyens de vous contacter en fonction de :
 
# * le navigateur du terminal / OS
 
# * le navigateur du terminal / OS
 
# * Votre heure de la journée / interruptibilité
 
# * Votre heure de la journée / interruptibilité
Ligne 34 : Ligne 31 :
 
Les membres de la communauté IndieWeb faisant ça  
 
Les membres de la communauté IndieWeb faisant ça  
 
=== Tantek ===
 
=== Tantek ===
−
{{t}} experime avec un prototype sur tantek.com/contact depuis le 2014-11-18 (et précédemment contact.html depuis 2014-06 lors de l'[[2014|IndieWebCamp 2014]])
+
{{t}} expérimente un prototype sur tantek.com/contact depuis le 2014-11-18 (et précédemment contact.html depuis 2014-06 lors de l'[[2014|IndieWebCamp 2014]])
 
* affichage conditionnel du bouton Facetime seulement pour iOS et MacOS (en date du 2014-10-11 à [[2014/Cambridge|IndieWebCamp Cambridge]])
 
* affichage conditionnel du bouton Facetime seulement pour iOS et MacOS (en date du 2014-10-11 à [[2014/Cambridge|IndieWebCamp Cambridge]])
−
* instruction menu déroulant "Add to Homescreen" lors du premier chargement (en date du 2014-10-29 à W3C TPAC - vérifiée sur l'iPad d'{{hober}}). Beaucoup de violon, mais voici le code utilisant la  [http://cubiq.org/add-to-home-screen bibliothèque "Add to Home Screen" de Matteo] qui fonctionnait : <blockquote style="white-space:pre"><code style="background:none"><nowiki><script src="/addtohome.min.js"></script>
+
* instruction menu déroulant "Add to Homescreen" lors du premier chargement (en date du 2014-10-29 à W3C TPAC - vérifiée sur l'iPad d'{{hober}}). Beaucoup de violon, mais voici le code utilisant la  [http://cubiq.org/add-to-home-screen bibliothèque "Add to Home Screen" de Matteo] qui fonctionnait : <blockquote style="white-space:pre"><code style="background:none"><nowiki><script src="/addtohome.min.js"></script>
 
<script>
 
<script>
 
var addtohome = addToHomescreen({
 
var addtohome = addToHomescreen({
Ligne 46 : Ligne 43 :
  
 
=== Tim Owens ===
 
=== Tim Owens ===
−
[[User:Timowens.io|Tim Owens]] a réglé une belle page de comm indie sur http://timowens.io/contact/ depuis le 2014-10-11 (à [[2014/Cambridge|IndieWebCamp Cambridge]]) comprenant :
+
[[User:Timowens.io|Tim Owens]] a réglé une belle page de comm indie sur http://timowens.io/contact/ depuis le 2014-10-11 (à [[2014/Cambridge|IndieWebCamp Cambridge]]) :
 
* affiche une instruction animée "Add to Homescreen" en menu déroulant lors du premier chargement.
 
* affiche une instruction animée "Add to Homescreen" en menu déroulant lors du premier chargement.
  
 
== Précédents exemples ==
 
== Précédents exemples ==
 
=== Ben Werdmuller ===
 
=== Ben Werdmuller ===
−
[[User:Werd.io|Ben Werdmuller]] utilisait les icônes pour lier vers un petit ensemble pratique de moyens pour le contacter sur sa page d'accueil [http://werd.io/ werd.io]. (2014-...-...?)
+
[[User:Werd.io|Ben Werdmuller]] utilisait des icônes pour faire un lien vers un petit ensemble pratique de moyens de contacts  sur sa page d'accueil [http://werd.io/ werd.io]. (2014-...-...?)
  
 
== Projets ==
 
== Projets ==
Ligne 66 : Ligne 63 :
 
(screenshot/maquette demandée !)
 
(screenshot/maquette demandée !)
  
−
Peut-être activé/désactivé selon la connexion, l'heure de la journée, le statut du sommeil, etc.
+
Peut-être activée/désactivée selon la connexion, l'heure de la journée, le statut du sommeil, etc.
  
 
Les trois boutons se comporteraient comme suit :  
 
Les trois boutons se comporteraient comme suit :  
Ligne 96 : Ligne 93 :
  
 
Même mieux (avantage : pas besoin d'UI de confirmation supplémentaire  en popup)
 
Même mieux (avantage : pas besoin d'UI de confirmation supplémentaire  en popup)
−
*# have already gotten [[Micropub]] authorization from the sender at sign-in time
+
*# ont déjà obtenu l’autorisation [[Micropub-fr|Micropub]] de l'expéditeur lors de la connexion dans le temps
−
*# use Micropub to private publish the message as a private outgoing message on the sender's website
+
*# utilise Micropub pour publier en privé le message comme un message sortant privé sur le site Web de l'expéditeur
−
*# the sender's site saves the message at a private permalink
+
*# le site de l'expéditeur enregistre le message sur un permalien privé
−
*# and sends a IndieWeb private message from their site to the recipient's site
+
*# et envoie un message privé IndieWeb de son site vers le site du destinataire
−
*# the recipient's website saves a copy of the private message at a private permalink
+
*# le site Web du destinataire enregistre une copie du message privé sur un permalien privé
−
*# the recipient's IndieWeb server sends a [[push notification]] to the recipient's currently active client devices (e.g. mobile, laptop).
+
*# le serveur de IndieWeb du destinataire envoie une [[push notification-fr|notification push]] vers les périphériques clients actuellement actifs du destinataire (par exemple mobile, ordinateur portable).
 +
Par conséquent on peut vous texted sans même quitter le web, ou selon le site/intermédiaire/service/système d’adressage tiers.
  
−
So people can txt you without ever leaving the web, or depending on a 3rd party site/intermediary/service/addressing system.
+
Repli :
−
 
+
* Sans IndieAuth connectez-vous, repliez vers une page de services existants
−
Fallback:  
+
** SMS, FB Messenger, Gtalk, email, Twitter DM
−
* without IndieAuth sign-in, fallback to a page of existing services
 
−
** sms, FB Messenger, Gtalk, email, Twitter DM
 
  
 
==== Boutons appel et vidéo ====
 
==== Boutons appel et vidéo ====
−
[call] + [video] -> initiate a WebRTC call (e.g. [[Firefox Hello]]) with only-voice or video+voice accordingly
+
[call] + [video] -> initier un appel WebRTC (par ex. [[Firefox Hello]]) avec de la voix seule ou vidéo + voix selon
−
* assuming your client browser supported that
+
* supposant que le navigateur de votre client supporte ça
−
** if not, it can fall back to a page of existing services
+
** si non, il peut se replier vers une page de services existants
 
*** FaceTime, Skype, etc.
 
*** FaceTime, Skype, etc.
  
−
Ideally the mechanism for an audio call, while in-progress, could allow the caller and/or callee to opt-in to allowing for video, and if both did so, the audio call would be upgraded to audio+video.
+
Idéalement, le mécanisme pour un appel audio pourrait permettre à l'appelant et/ou l’appelé à faire un opt-in pour permettre  la vidéo, et si les deux ont fait, l'appel audio serait mis à niveau vers audio + vidéo.
  
−
=== Verb redirect URLs ===
+
=== URLs de redirection ===
−
Might be convenient to setup a few redirect URLs (perhaps even as a building block of said 3 button UI)
+
Ce pourrait être pratique de configurer quelques URLs de redirection (peut-être même sous forme de bloc de construction des 3 boutons d’UI)
  
−
* <kbd>/txt</kbd> and/or <kbd>/sms</kbd> - redirects to an SMS: URL for you, or provides a simple SMS txting UI (similar to such UIs on mobile apps like [[iMessage]], [[Google Hangouts]] etc.)
+
 
−
* <kbd>/call</kbd> - redirects to a FaceTime (audio) URL, or tel: URL, or provides a WebRTC start call UI.
+
* <kbd>/txt</kbd> et/ou <kbd>/sms</kbd> - redirige vers un SMS : URL pour vous, ou fournit une UI simple de SMS text (similaire aux UIs équivalentes sur des apps mobiles comme [[iMessage]], [[Google Hangouts]] etc.)
−
* <kbd>/facetime</kbd> - redirects to a FaceTime (video) URL to make a video call
+
* <kbd>/call</kbd> - redirige vers une URL FaceTime (audio), ou  tel : URL, ou fournit une UI d’appel de départ WebRTC.
 +
* <kbd>/facetime</kbd> - redirige vers URL FaceTime (vidéo) pour produire un appel vidéo.
  
 
=== Maquettes ===
 
=== Maquettes ===
Ligne 130 : Ligne 127 :
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-icons-folders-ios7.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-icons-folders-ios7.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
  
 +
====  Contact élargi ====
 +
Quand un lecteur tape l’icône du dossier '''Contact''' elle se dilate comme suit, puis le lecteur peut exploiter le mode de messagerie/communication qu'il souhaite utiliser pour me contacter ce qui ouvre immédiatement un nouveau message (txt, FB Messenger, G + Hangouts, AIM IM), ou lance un nouvel appel (FaceTime, Skype), ou une nouvelle fenêtre Twitter de message direct. Directement vers la communication - en contournant tous les distracteurs des apps de communication page d'accueil / d'activité.
  
 +
Le seul changement que je ferais sur ces maquettes sont quelques-unes des étiquettes. Toutes les étiquettes doivent être des verbes, pas des noms, indiquant l'action que l'utilisateur veut produire et renforçant ainsi son intention.
  
−
==== Contact expanded ====
+
Par exemple. "Messages" devraient être « texter un message", "Messenger" devrait être "message FB", "Hangouts" devrait être "GTalk", et le reste semble bien se lire sous forme de verbes.
−
When a viewer taps the '''Contact''' icon folder it expands as follows, and then the viewer can tap the mode of messaging/communicating they want to use to contact me which immediately opens a new message (txt, FB Messenger, G+ Hangouts, AIM IM), or starts a new call (FaceTime, Skype), or Twitter new direct message window. Directly to communicating - bypassing all comm app home page / activity distractors.
 
−
 
 
−
The one change I'd make from these mockups are some of the labels. All of the labels should be verbs, not nouns, indicating the action the user wants to take and thus reinforcing their intention.
 
−
 
 
−
E.g. "Messages" should be "txt message", "Messenger" should be "FB message", "Hangouts" should be "GTalk", and the rest seem to read fine as verbs.
 
  
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-contact-ios7.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-contact-ios7.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
  
−
 
+
==== Maquettes iOS6 ====
−
 
+
Les prototypes originaux faits dans iOS6, ne valant probablement pas la peine d’être mis en oeuvre, mais pouvant contenir des idées d'interface intéressantes :
−
==== iOS6 mockups ====
 
−
Original prototypes done in iOS6, probably not worth implementing, but may contain interesting UI ideas nonetheless:
 
  
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-icons-folders-mockup.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-icons-folders-mockup.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
  
−
 
−
'''Contact expanded'''
 
−
 
−
The one change I'd make from these mockups are some of the labels. All of the labels should be verbs, not nouns, indicating the action the user wants to take and thus reinforcing their intention.
 
−
 
−
E.g. "Messages" should be "txt message", "Messenger" should be "FB message", "Hangouts" should be "GTalk", and the rest seem to read fine as verbs.
 
  
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-contact.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
 
<div style="border:.5em solid gray;float:left">[[File:mobile-personal-home-contact.jpg]]<br/>[[File:2013-346-tantek-home-posts.jpg]]</div><br style="clear:both"/>
  
 +
=== Améliorer Installer Expérience ===
 +
Actuellement les sites doivent utiliser un script alambiqué pour tenter de demander à l'utilisateur d'ajouter sa page comms à l'écran d'accueil à savoir l’installer.
  
−
=== Improving Install Experience ===
+
"[http://updates.html5rocks.com/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android Web App installer des bannières]" peut être un moyen d'améliorer cette UX, mais il faut que votre page de comms soit/ait :
−
Currently sites have to use a convoluted script to attempt to prompt the user to add their comms page to the home screen AKA install it.
+
* [[HTTPS]]
 +
* Supporte un [[manifeste web app]] [http://updates.html5rocks.com/2014/11/Support-for-installable-web-apps-with-webapp-manifest-in-chrome-38-for-Android] (voir [https://github.com/GoogleChrome/samples/tree/gh-pages/app-install-banner échantillon manifeste])
 +
** nom court
 +
** icône 144x144 png avec mime type explicite d'image/png
 +
* Un [[service worker]] [http://www.html5rocks.com/en/tutorials/service-worker/introduction/] enregistré sur le site, par exemple voir la [https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/custom-offline-page/service-worker.js page d'exemple simple et personnalisée hors-ligne]
  
−
"[http://updates.html5rocks.com/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android Web App install banners]" may be one way of improving this UX, but it requires that your comms page be / have:
 
−
* [[HTTPS]]
 
−
* have a [[web app manifest]][http://updates.html5rocks.com/2014/11/Support-for-installable-web-apps-with-webapp-manifest-in-chrome-38-for-Android] (see [https://github.com/GoogleChrome/samples/tree/gh-pages/app-install-banner sample manifest])
 
−
** short_name
 
−
** 144x144 png icon with explicit mime type of image/png
 
−
* a [[service worker]][http://www.html5rocks.com/en/tutorials/service-worker/introduction/] registered on the site, e.g. see the [https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/custom-offline-page/service-worker.js simple custom offline page example]
 
  
 
Limites :
 
Limites :
−
* The user must visit your site "twice over two separate days during the course of two weeks."[http://updates.html5rocks.com/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android]
+
* L'utilisateur doit visiter votre site "deux fois sur deux jours séparés au cours des deux semaines.» [http://updates.html5rocks.com/2015/03/increasing-engagement-with-app-install-banners-in-chrome-for-android]
−
** This fails to address the use-case of meeting in person and exchanging contact (web) addresses and expecting it to be one-click "installable" upon loading the page *once*
+
** Cela ne répond pas au cas d'utilisation de rencontrer en personne et d’échanger des adresses de contact (web) et à s’attendre à être "installable" en un clic lors du chargement de la page.
  
 
== Cas d'Usages Supplémentaires ==
 
== Cas d'Usages Supplémentaires ==
 
=== Authentification ===
 
=== Authentification ===
−
When communicating from one indieweb user to another, how do you authenticate that the person you are communicating with is actually the person you think it is? This applies to [[messaging]] in general.
+
Au moment de communiquer d'un utilisateur indieweb à un autre, comment authentifiez-vous que la personne avec qui vous communiquez est effectivement la bonne personne à laquelle vous pensez ? Ceci s'applique à la [[messaging-fr|messagerie]] en général.
−
 
 
−
(This use-case is a stub and should be expanded)
 
−
 
 
−
Lors de la communication d'un utilisateur indieweb à un autre, comment voulez-vous authentifier que la personne avec qui vous communiquez est en fait la personne que vous pensez être ? Cela vaut pour la [[messaging-fr|messagerie]] en général.
 
  
−
(Ce cas est une ébauche et devrait être développé)
+
(Ce cas d'usage est une ébauche et devrait être développé)
  
 
== Articles ==
 
== Articles ==

Version actuelle datée du 24 juin 2022 à 06:55

Cet article est une débauche. Vous pouvez m’aider à l'améliorer.


Cette page a démarré sur iwc:communication

La communication dans le contexte de l'indieweb fait référence à l'utilisation de votre site personnel comme un point de départ et un moyen potentiel pour que les personnes vous contactent.

Comment faire

Faites de votre page d'accueil un écran d'accueil amical

Ajoutez un icône pour votre site personnel afin que les autres puissent ajouter votre site à leurs écrans d'accueil sur leurs appareils.

Ajouter une carte de contact

Déposez h-card sur votre page d'accueil avec des liens vers les moyens avec lesquels vous souhaitez être contacté.e, dans votre ordre de préférence.

Ajouter une interface de contact

Posez cette h-card sur une page /contact séparée sur votre site Web, par exemple sur princesse.com/contact avec :

  1. des icônes facilement reconnaissables/cliquables pour chaque lien vers un moyen de vous contacter.
  2. En option : montrer conditionnellement/cacher les moyens de vous contacter en fonction de :
  3. * le navigateur du terminal / OS
  4. * Votre heure de la journée / interruptibilité

Pour avoir des instructions de balisage détaillées, voir :

Pour des exemples, voir en-dessous.

Pourquoi

Voir :

Exemples IndieWeb

Les membres de la communauté IndieWeb faisant ça

Tantek

portrait Tantek Çelik expérimente un prototype sur tantek.com/contact depuis le 2014-11-18 (et précédemment contact.html depuis 2014-06 lors de l'IndieWebCamp 2014)

  • affichage conditionnel du bouton Facetime seulement pour iOS et MacOS (en date du 2014-10-11 à IndieWebCamp Cambridge)
  • instruction menu déroulant "Add to Homescreen" lors du premier chargement (en date du 2014-10-29 à W3C TPAC - vérifiée sur l'iPad d'Modèle:Hober). Beaucoup de violon, mais voici le code utilisant la bibliothèque "Add to Home Screen" de Matteo qui fonctionnait :

    <script src="/addtohome.min.js"></script> <script> var addtohome = addToHomescreen({ maxDisplayCount: 1, detectHomescreen: "hash" }); </script>

Tim Owens

Tim Owens a réglé une belle page de comm indie sur http://timowens.io/contact/ depuis le 2014-10-11 (à IndieWebCamp Cambridge) :

  • affiche une instruction animée "Add to Homescreen" en menu déroulant lors du premier chargement.

Précédents exemples

Ben Werdmuller

Ben Werdmuller utilisait des icônes pour faire un lien vers un petit ensemble pratique de moyens de contacts sur sa page d'accueil werd.io. (2014-...-...?)

Projets

Lets Talk

Let's Talk est un script utilisateur qui affiche les h-cards dans un format standard. Quand vous allez sur le site web de quelqu'un, Let’s Talk vous présente en un coup d'oeil comment les contacter et quelles méthodes de contact ils préfèrent. Voir https://snarfed.org/2014-03-10_lets-talk-userscript pour plus de détails.

Brainstorming

UI trois boutons

Idéalement une UI de contact indieweb (par ex. la page /contact de quelqu'un) devrait avoir trois boutons : 

[txt] [call] [video]

(screenshot/maquette demandée !)

Peut-être activée/désactivée selon la connexion, l'heure de la journée, le statut du sommeil, etc.

Les trois boutons se comporteraient comme suit :

bouton Txt

[txt] button -> révèle une UI d'entrée de message texte 

(Connexion) (s'il n'est pas déjà connecté avec indieauth)
[ aire de message texte ]
(Envoyer)

(screenshot/maquette demandés !)

Cliquer le bouton (Envoyer) devrait :

Au minimum :

    1. Soumettre le message au serveur Indie Web du destinataire
    2. Le serveur IndieWeb du destinataire enverrait un notification push vers les périphériques clients actuellement actifs du destinataire (par exemple mobile, ordinateur portable).

Mieux (avantage : le site de l'expéditeur conserve une copie du message)

    1. webaction pour envoyer un message direct
    2. géré par le gestionnaire indie-config de l'expéditeur déjà enregistré
    3. le propre site de l'expéditeur affiche une UI de confirmation en popup pour envoyer ce message au destinataire
    4. Le site de l'expéditeur enregistre le message à un permalien privé
    5. Et envoie un message privé IndieWeb à partir de son site vers le site du destinataire
    6. Le site web du destinataire enregistre une copie du message privé sur un permalien privé
    7. Le serveur IndieWeb du destinataire envoie une notification push sur les périphériques clients actuellement actifs du destinataire (par exemple mobile, ordinateur portable).

Même mieux (avantage : pas besoin d'UI de confirmation supplémentaire en popup)

    1. ont déjà obtenu l’autorisation Micropub de l'expéditeur lors de la connexion dans le temps
    2. utilise Micropub pour publier en privé le message comme un message sortant privé sur le site Web de l'expéditeur
    3. le site de l'expéditeur enregistre le message sur un permalien privé
    4. et envoie un message privé IndieWeb de son site vers le site du destinataire
    5. le site Web du destinataire enregistre une copie du message privé sur un permalien privé
    6. le serveur de IndieWeb du destinataire envoie une notification push vers les périphériques clients actuellement actifs du destinataire (par exemple mobile, ordinateur portable).

Par conséquent on peut vous texted sans même quitter le web, ou selon le site/intermédiaire/service/système d’adressage tiers.

Repli :

  • Sans IndieAuth connectez-vous, repliez vers une page de services existants
    • SMS, FB Messenger, Gtalk, email, Twitter DM

Boutons appel et vidéo

[call] + [video] -> initier un appel WebRTC (par ex. Firefox Hello) avec de la voix seule ou vidéo + voix selon

  • supposant que le navigateur de votre client supporte ça
    • si non, il peut se replier vers une page de services existants
      • FaceTime, Skype, etc.

Idéalement, le mécanisme pour un appel audio pourrait permettre à l'appelant et/ou l’appelé à faire un opt-in pour permettre la vidéo, et si les deux ont fait, l'appel audio serait mis à niveau vers audio + vidéo.

URLs de redirection

Ce pourrait être pratique de configurer quelques URLs de redirection (peut-être même sous forme de bloc de construction des 3 boutons d’UI)


  • /txt et/ou /sms - redirige vers un SMS : URL pour vous, ou fournit une UI simple de SMS text (similaire aux UIs équivalentes sur des apps mobiles comme iMessage, Google Hangouts etc.)
  • /call - redirige vers une URL FaceTime (audio), ou tel : URL, ou fournit une UI d’appel de départ WebRTC.
  • /facetime - redirige vers URL FaceTime (vidéo) pour produire un appel vidéo.

Maquettes

page accueil iOS7

Voici quelques maquettes sur la façon dont vous pourriez présenter une barre de haut niveau pour la communication, la collaboration et d'autres options familières à un utilisateur iOS 7 iPhone / iPod :


Contact élargi

Quand un lecteur tape l’icône du dossier Contact elle se dilate comme suit, puis le lecteur peut exploiter le mode de messagerie/communication qu'il souhaite utiliser pour me contacter ce qui ouvre immédiatement un nouveau message (txt, FB Messenger, G + Hangouts, AIM IM), ou lance un nouvel appel (FaceTime, Skype), ou une nouvelle fenêtre Twitter de message direct. Directement vers la communication - en contournant tous les distracteurs des apps de communication page d'accueil / d'activité.

Le seul changement que je ferais sur ces maquettes sont quelques-unes des étiquettes. Toutes les étiquettes doivent être des verbes, pas des noms, indiquant l'action que l'utilisateur veut produire et renforçant ainsi son intention.

Par exemple. "Messages" devraient être « texter un message", "Messenger" devrait être "message FB", "Hangouts" devrait être "GTalk", et le reste semble bien se lire sous forme de verbes.


Maquettes iOS6

Les prototypes originaux faits dans iOS6, ne valant probablement pas la peine d’être mis en oeuvre, mais pouvant contenir des idées d'interface intéressantes :




Améliorer Installer Expérience

Actuellement les sites doivent utiliser un script alambiqué pour tenter de demander à l'utilisateur d'ajouter sa page comms à l'écran d'accueil à savoir l’installer.

"Web App installer des bannières" peut être un moyen d'améliorer cette UX, mais il faut que votre page de comms soit/ait :


Limites :

  • L'utilisateur doit visiter votre site "deux fois sur deux jours séparés au cours des deux semaines.» [3]
    • Cela ne répond pas au cas d'utilisation de rencontrer en personne et d’échanger des adresses de contact (web) et à s’attendre à être "installable" en un clic lors du chargement de la page.

Cas d'Usages Supplémentaires

Authentification

Au moment de communiquer d'un utilisateur indieweb à un autre, comment authentifiez-vous que la personne avec qui vous communiquez est effectivement la bonne personne à laquelle vous pensez ? Ceci s'applique à la messagerie en général.

(Ce cas d'usage est une ébauche et devrait être développé)

Articles

Articles sur quelques-uns des défis de communication basée sur les personnes :

Articles concernant la recherche et la résolution de communication personnelle basée sur indieweb :

Voir aussi

Récupérée de « https://ducamp.me/index.php?title=Communication&oldid=34764 »