4 ms·

Webex's Slack-like chat room service uses Adaptive Cards to define interactive messages from bots, just like Microsoft Teams does. I do agree with you that it

Webex's Slack-like chat room service uses Adaptive Cards to define interactive messages from bots, just like Microsoft Teams does. I do agree with you that it should catch on more and it's unfortunate that it hasn't.

valgaze 4y ago
+ 1 ex. You can do something like this: https://i.imgur.com/dcbzn3w.gif https://i.imgur.com/dcbzn3w.gif I do a lot of thinking about conversation design "tooling" for automated agents and I found wrangling Adaptive Cards with "dynamic" content was a bit annoying since there's so many options. I needed a simple subset of functionality to cover most cases and to add features like tappable suggestion "chips" I made little a utility called "Speedycard" which lets you "build" Adaptive Cards kinda like this:g const myCard = new SpeedyCard() .setTitle('System is ') .setSubtitle('If you see this card, everything is working') .setImage('https://i.imgur.com/VQoXfHn.gif') .setInput(`What's on your mind?`) .setUrl('https://www.youtube.com/watch?v=3GwjfUFyY6M', 'Take a moment to celebrate') .setTable([[`Bot's Date`, new Date().toDateString()], ["Bot's Uptime", `${String(process.uptime())}s`]]) .setData({mySpecialData: {a:1, b:2}}) const fullCard = myCard.render() // JSON passed to an API/client While I am convinced about the importance of conversation design and being thoughtful about this stuff sometimes it's convenient to just have a little form and the user adds their data and call it day Cards source (can use this anywhere): https://github.com/valgaze/speedybot/blob/master/src/cards.ts https://github.com/valgaze/speedybot/blob/master/src/cards.t... Experiment optimized for Cloudflare Workers: https://www.npmjs.com/package/speedybot-hub https://www.npmjs.com/package/speedybot-hub Main Library: https://www.npmjs.com/package/speedybot https://www.npmjs.com/package/speedybot

valgaze 4y ago

+ 1 ex. You can do something like this: https://i.imgur.com/dcbzn3w.gif https://i.imgur.com/dcbzn3w.gif I do a lot of thinking about conversation design "tooling" for automated agents and I found wrangling Adaptive Cards with "dynamic" content was a bit annoying since there's so many options. I needed a simple subset of functionality to cover most cases and to add features like tappable suggestion "chips" I made little a utility called "Speedycard" which lets you "build" Adaptive Cards kinda like this:g const myCard = new SpeedyCard() .setTitle('System is ') .setSubtitle('If you see this card, everything is working') .setImage('https://i.imgur.com/VQoXfHn.gif') .setInput(`What's on your mind?`) .setUrl('https://www.youtube.com/watch?v=3GwjfUFyY6M', 'Take a moment to celebrate') .setTable([[`Bot's Date`, new Date().toDateString()], ["Bot's Uptime", `${String(process.uptime())}s`]]) .setData({mySpecialData: {a:1, b:2}}) const fullCard = myCard.render() // JSON passed to an API/client While I am convinced about the importance of conversation design and being thoughtful about this stuff sometimes it's convenient to just have a little form and the user adds their data and call it day Cards source (can use this anywhere): https://github.com/valgaze/speedybot/blob/master/src/cards.ts https://github.com/valgaze/speedybot/blob/master/src/cards.t... Experiment optimized for Cloudflare Workers: https://www.npmjs.com/package/speedybot-hub https://www.npmjs.com/package/speedybot-hub Main Library: https://www.npmjs.com/package/speedybot https://www.npmjs.com/package/speedybot