Яке зручне рішення для редагування шаблонів електронної пошти із змінними змінними?


9

Я працюю над системою, в якій ми покладаємось на базу даних про багато адміністраторів / менеджерів, що надсилають електронну пошту користувачам. Однією з ключових особливостей є можливість надсилати електронне повідомлення декільком людям одночасно з конкретною інформацією, що стосується кожної з них. Ще однією ключовою особливістю є можливість розробки електронних листів, оскільки, як правило, потрібно щоразу трохи змінювати їх, але наявність базового шаблону економить багато часу.

Для цього у нас є типове рішення "шаблони", де у нас є шаблон, який виглядає приблизно так:

Hello {{recipient.full_name}},

Your application to {{activity.title}} has been accepted. 
You have requested to participate on dates {{application.dates}}, in role {{application.role}}
Blah blah blah

Проблема, яка у нас виникає, очевидно, що (як ми і очікували) менеджери не мають усієї ідеї про "змінні", і вони роблять такі речі, як їх перезаписування, що не дозволяє їм надсилати електронну пошту більше, ніж одній людині одночасно, припускаючи вони не збираються замінюватись, а система порушена, або навіть незрозумілі речі, такі як "Привіт {{Джон}}".

Велика проблема полягає в тому, що це, як зазвичай, не відводиться до розділу "адміністратор", де лише деякі користувачі енергії мають доступ до редагування шаблонів, які автоматично надсилаються, і від них очікується знати, що вони роблять. Кожен користувач системи стикається з цією проблемою.

Очевидним рішенням було б замінити змінні, перш ніж цей шаблон буде показаний користувачеві для редагування, але це не працює при надсиланні електронною поштою кількох людей.

Це здається досить поширеною проблемою, і ми сподіваємось, що хтось це вже вирішив.

Чи бачили ви десь / створили / можете придумати хороші рішення цієї проблеми?

Оновлення

Що я в кінцевому підсумку робив на основі відповіді Даніеля Б - це виявлення на основі положення курсору та положення {{}} в коді, чи користувач наразі знаходиться "всередині змінної" чи "зовні". Всередині я показую невеликий фрагмент тексту нижче великої текстової області, в якій пояснюється, що це буде замінено, і що вони можуть його повністю видалити, якщо захочуть, але вони не можуть його редагувати.

Я роблю це onClick, onChange, onKeyDown, onKeyUp. Для подій "ключ", якщо ми перебуваємо всередині змінної, я повертаю TRUE лише у випадку, якщо keyCode є одним із кількох "навігаційних" клавіш. В іншому випадку я повертаю FALSE, що фактично перешкоджає виданню цієї змінної.

Це не ідеально, але це було дуже дешево, і здається ефективним.


Прокоментуйте людей, які мають більше представників, ніж я: (Я новачок у UX) Чи можете ви, будь ласка, позначити це питання? Тут не існують усі теги, про які я думаю, ще не існують: шаблони змінних інтерфейсу, призначеного для редагування, призначеного для користувача

Як представлені ці шаблони? Це просто звичайний текст у редакторі?
ChrisF

Зараз так, коли ви вибираєте купу людей і натискаєте на "Повідомлення", ви отримуєте діалогове вікно "спливаючого вікна" з великим текстовим майданчиком, що містить вміст шаблону прямо там. Це насправді markDown, хоча, очевидно, наші користувачі до цього не звикли, це схоже на звичайний текст. У нас немає редактора wysiwyg, і ми готові використовувати його, якщо він допоможе, але сам по собі це не зробить, люди все ще не зрозуміють змінні

Основна проблема тут полягає в тому, що ваші менеджери не розуміють змінних. Якщо ви не вирішите цю проблему, ваші проблеми кидаються на симптоми. Не всі проблеми потребують рішення кодування.
Темна ніч

Домовились. Мені б хотілося, щоб можна було навчати людей, але ми не можемо попросити їх прочитати посібники, очевидно, тому я шукаю ідеї, як зробити їх зрозумілими легко. Ідеї?
Даніель Маґіола

Відповіді:


3

За запитом коментарів у відповіді ChrisF, ось одне рішення, яке я використовував у минулому:

  • Використовуйте WinForms RichTextBox, щоб дозволити користувачеві редагувати текст шаблону.
  • Дозволити перетягування / падіння (або інше вставлення) змінних або заповнювачів у RichTextBox.
  • Забороніть редагування самих змінних, перевіряючи навколо поточного місця курсору розмежувачі ваших змінних (символи {{і}} у вашому прикладі).

Моя реалізація виглядала приблизно так:

Приклад RichTextBox

Він має необов'язкове виділення змінної, щоб відрізняти її від стандартного тексту.
Змінні роздільники фактично є, вони просто мають однакові кольори переднього плану та фону.

Очевидно, що це зовсім інакше від вашої реалізації, яка базується на HTML. Я б, напевно, вивчив, як реалізується редактор Gmail; це схоже на текстарею, але здатне мати вбудовані зображення (посмішки тощо), що схоже на поведінку, яку ви шукаєте.


4

Я б подумав змінити спосіб подання шаблону користувачеві, щоб ви могли зробити частини, які будуть змінені кодом, не можна редагувати. Щось на зразок цього:

макет

Біти, які ви не бажаєте, щоб користувач міняв, тепер не можна редагувати. Ви можете включити кнопку закриття, щоб вони могли видалити предмети, якщо вони не потребують. Ви також можете включити пояснювальний текст та / або підказки, щоб пояснити, що {{...}}означають біти і чому їх слід залишати в спокої.

Використання чогось на зразок Silverlight / WPF WrapPanelдля кожного абзацу може дати вам щось, що дозволяє кожній частині (редагованій та не редагованій) текти по мірі зростання та скорочення тексту, керованого користувачем.


Основна проблема з цим полягає в тому, що я не можу зробити текстові поля як "вбудованими", так і "багаторядковими" ... І таким чином макет був би надзвичайно дивним ... Якби ви могли відредагувати те, що "Шановний" і змінна змістилася б правильно, а там було ще одне текстове поле, що правильно, що магічно загорнуте, це було б ДУЖЕ. Але я не бачу, як я можу це здійснити. Альтернативою, з якою ми намагалися працювати, є наявність "не редагованих" блоків у великій текстовій області, так що ви не можете змінювати їх вміст, але ви можете їх видалити (з "X"). Ми не змогли зробити цю роботу. Ви його десь бачили? Дякую!!!

@DanielMagliola щось подібне до Silverlight / WPF WrapPanelдля кожного абзацу може дати вам щось схоже.
ChrisF

@DanielMagliola в минулому мені вдалося досягти цього за допомогою WinForms RichTextBox. "Змінні" можна перетягувати в Richtextbox, і до нього буде застосовано стилізація, щоб зрозуміти, що це заповнювач місця. Хитра частина - це запобігання змін змінних. Одне рішення - перевірити поточне розташування курсора для символів тегу та заборонити редагування, якщо це так.
Даніель Б

Я забув згадати про це, це додаток HTML, але все-таки ця ідея застосовна. Мені подобається "перевірка положення курсору і заборона ідеї редагування", дякую за це !!
Даніель Маґіола

@DanielB: Насправді, чи можете ви відповісти, я думаю, у вас є переможець! Дякую!!
Даніель Маґіола
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.