Embeds 2.0 - Githubissues

Inspired by: https://feedback.discordapp.com/forums/326712-discord-dream-land/suggestions/32353498-discord-embeds-2-0

Embeds have become one of the most essential tool to bot developers everywhere. In my experience, they have a huge potential to be improved.

The first problem that comes to mind is that it is really hard make it nice and responsive across devices. Although they have built in tools that make them appear differently on different devices, it just looks very bad trying to convert all fields to inline: false on mobiles. Although this makes it fit, I would like to have the ability to do something else. In order to avoid, making walls of embeds on mobile devices, I am forced to make PC users suffer and have smaller content on the embeds so that mobile users can have a decent experience and not have insanely long embeds.

// This would use the different embeds on different devices as opposed to 1 fits all
return msg.channel.send({ pcEmbed, mobileEmbed });

Another way to solve this responsive issue, is by possibly implementing the CSS Grid system.

A while back, Discord stated that they don't really like the idea of using reactions as buttons for flipping pages or doing polls. So, why not allow buttons in embeds. Allowing developers to create embeds with proper buttons would allow all developers to build epic systems. Buttons could be created with custom functions tied to each and when it is tapped the function is triggered. As an example, press the X button to get the X role.
Videos. OMG Videos! Videos in embeds are already possible for embeds made by discord but not for bots. How is this not a thing? Please make it a thing. We like this thing. We need this thing.
Fonts and colors. Girl, I need my makeup! Having the ability to use different fonts, font sizes, and different colors in embeds would go a long way in improving embeds. As amazing as markdown is, it is very limiting in what can be accomplished. The only way to currently have colors in embeds is to use markdown highlights in code blocks but that really destroys the beauty of the embed. Discord, please let us be fashionable.
Speaking of fonts can we please take the monospaced font from codeblocks and add it to embeds. Pretty please. One of the biggest headaches is that things are very hard to line up and that causes it to look very bad. Having the ability to use monospaced fonts would make it so you could cleanly add spaces to align content make it so much better for user experience.

You can see how without monospaced font the content is just not clean for the team stats.

Custom backgrounds of embeds. Although embeds are really nice and pretty, seeing them again and again can make them very dull. One very simple and amazing feature would be to set an image as the background of that embed. This way we could provide users the ability to set their own backgrounds and change them when they feel they are getting bored of it.
Multiple images. As an example, when a tweet is posted that contain multiple images and the bot shares it, it would be nice to be able to upload multiple images as well into the embed instead of only the first image. We are forced to share a link to the tweet that takes users off discord to view all the images or spam all the images in the channel as opposed showing them as a slideshow or reduce sizes and show all in the same dimensions as 1 large image
Speaking of images, we should really have the ability to customize image sizes. Embeds can be very long if you keep adding content like 25 fields. However, an image no matter how large can not expand past its maximum height. Having the ability to customize images can allow developers to create images with larger heights to display better and more cleaner data using tools like canvas.

I'd be up for a few of these myself. Though with that said, I feel the need to critique these ideas, as a 👍 or a 👎 to the comment don't really do my thoughts justice.

Responsiveness. Neutral. I don't really have any comments here.

Buttons in embeds. Neutral. Despite what the devs have said in the past, after a while I got the impression that they might have gone back on this for one reason or another. Maybe it's just not worth the effort to them? Or maybe there's the potential for security risks. How would you implement these in a way that could please everyone? Or maybe they are working on them. I don't know what they feel about it, but it's been a while since they said that, so maybe something's changed in their minds? Regardless, reactions work fine for now, so I'm not sure about this idea.

Videos. Neutral. While I suppose this could be a good idea, I have to wonder if allowing bots to put arbitrary video in an embed would even be worth the effort. If the bot generates an animation of some sort, more than likely it's already using the .gif format rather than making an MP4. I don't imagine anything more than bots with tag features (like 42) will be posting anything in MP4 format, and will probably be using plain-text format at that point anyways.

Additional fonts. Disagree. I don't think additional fonts should be added, because that's just more that needs to be downloaded. Might not be a big deal on desktop, but on mobile there's a concern about network data usage.

Colors, on the other hand, would be a welcome addition. But then I'd have to wonder, how will Discord will implement it in Markdown? Will it be BBcode-style, like [color=#FFC0CB]text[/color] or [color=pink]text[/color]? Or will we get to use a HTML-like tag?

Monospace fonts. Disagree. You can already do `single backticks` to show monospace text. However, for lining things up, I wouldn't be averse to having tables (which are part of Markdown normally -- Discord just doesn't allow them currently).

Custom backgrounds. I'm neutral on this one. It would make embeds look nice, but at the same time that's just another image to download, which could be an issue for users with limits on monthly data usage. What benefit would it have besides making embeds look nicer?

Multiple images. Agree. We can already post multiple attachments in one message. I don't see why embeds couldn't have that too.

Customizable image sizes. Disagree. I think the image sizes are good as-is. Additionally, while I don't think being able to customize image sizes is a bad idea, I can't really think of many use cases for that functionality. Perhaps someone could give me an example?

I think the button idea can expanded on. I'm not sure how the layout will exactly look. The bot developer might want to place buttons where he wants. The dev might want at the top or at the bottom or next to some text.

Honestly, I think that they should be a list of responses at the bottom of embed. Kind of like the list of replys on gmail, but instead of sending an email it sends a signal to a bot

The video part is interesting but I don't know how you are going to add custom formats to an embed and have it supported everywhere.

I don't think we need custom fonts as having more then 2 different fonts can become an eye sore from my experience making some websites. If you had many embeds on screen with many different fonts, it's not going to look very neat and clean but this is subjective.

Colors, I think should be done with just a few available. Mostly to keep a constent look or design for embeds. It's kind of similar to my last point.

I don't agree with the monospace font, similar to my above reason. But I do think that tables should be added to line things up.

I don't really like idea of custom backgrounds, because many embeds will have things in the foreground that might fuse with the background. However, this might work with a darken background and maybe some shadows.

I really like the idea of more then one image and see it being really useful for some bots.

However, I'm not so sure about custom image sizes. However, I can see them being useful to make smaller images and lay them out to save space, but I think this can be done with 3 size presets large, medium, small. I don't think they need to be custom.

@LikeLakers2 Buttons: As amazing as using reactions can be, it is a workaround for achieving the functionality of buttons. For example, reactions come with rate limit issues. Buttons would be a part of the embed so some "troll" can't delete a reaction and break the entire functionality for users. People can't add new reactions and then when users tap these they get confused why nothing happens. Each reaction needs to be awaited so that there is a proper order and if you have about 9-10 reactions that you need that could take a fair bit of time when your bot grows and you get used a lot. Nonetheless, i don't really disagree with using reactions as buttons but they were a workaround for missing functionality in the embeds. Buttons already exist in embeds on other platforms without any security risk that I am aware of.

Videos: Let me give you my personal use case idea: My bot has some very complicated functionality that can be a bit difficult to understand for many users. For this, I want to create guides that I can show users and not have them leave discord just to go watch them or be forced to post a url without an embed so it embeds that url, ewwwww. So they type !h command and that shows an embed with description and use cases etc but then there is a video with a beautiful guide OMG! GIFS as amazing as they are also restrictive and can't be as helpful as a video guide can.

There are other use cases as well that currently is solved by having to send an extra message with a URL without an embed so discord can embed it which just looks plain terrible and can be improved so much just be allowing videos in the embed itself.

Fonts: A feature should never be prevented simply because a device can't handle it. For one, there are already many features that exist on PC and not on mobile. As an example, hyperlinks in embeds can be clicked on in PC but not on mobile. Fonts is a truly amazing feature that could add life to embeds that is just lacking. Mobiles or any device that can not handle it can default to the standard font in all cases if that is the main issue.

Monospace: Using backticks only work when you don't need to properly align things on 90% of the embed because then it just looks terrible. It is like when you try to bold everything or CAPTILIZE EVERYTHING. Too much of a good thing can be a really bad thing. Monospace fonts already exist in codeblocks, why would it be any problem to have in embeds?

Backgrounds: That is probably the only benefit because when you use bots a lot the embeds can become dull and repetitive over and over. If each user had a custom background each embed could be unique and beautiful. I don't think functionality of the API or the tools available to bot developers should be limited based on users data issues. If someone doesn't have the data to handle it then they need a option conserve data which would not load any custom backgrounds, fonts, videos etc...

Customizable Image Sizes: The reason I think allowing custom lengths on images is to better supports bots that use canvas to create images. You see if I wanted to use canvas and create some really cool stuff but then when uploading it it gets shrunk into 667x334 if memory serves. Shrinking all that would inherently destroy the entire image as now things look small and squished. Embeds can already extend a lot as long as you keep adding content. Why can't the image extend as well? If the image size was customizable it could open up a lot of cool things for a lot of bot developers.

@yourWaifu Not all formats need to be supported but at least the main standard formats should be. I mean most of them are already supported when you put a link you can watch the video but this should also be possible in a embed.

On the part about colors/fonts/backgrounds being abused well that's a problem of how the tool is used. Just because the tool can be used badly doesn't mean it should not be made available to those that can use it properly. What I mean is, if you try and put colors/fonts/backgrounds on an embed badly then yes it will look bad. Do it properly and it will look amazing. Using your concept of colors/fonts based on website, what would happen if every website had the same font, same font sizes, same everything? How you use fonts and colors is up to the developers and they should do it well if they wish to use it.

I do like the idea of adding tables but there needs to be some way to align stuff on an embed without tables(rows/columns). I would not want to use tables at all, they would make things look terribly ugly with their lines marking the different rows/columns. I think perhaps a nice CSS grid system could do the magical trick here as well.

@Skillz4Killz

Buttons: Don't get me wrong, buttons sound like a fine idea in theory. What I was getting at was that I'm not sure what the position of the Discord Devs on buttons vs reactions currently is, since you yourself brought up their response from long ago.

Videos: I misunderstood you on this, then. I thought you were talking about embedding uploaded MP4s, not embedding something from a video service like YouTube. My bad!

Fonts: My point was that I was concerned about network data usage while on mobile. I'm not sure what gave you the impression that I was saying the device can't handle it, as I'm sure many devices can handle it.

Backgrounds: If that was the only reason I could put a background on my bot's embed, I wouldn't really see any reason to do so. Of course, I'm not the type of guy who cares too much about how his code looks, just so long as it's readable and it works, so take that as you will.

Customizable image sizes: The reason they get shrunk is because of a maximum width on embeds. Now I'm not sure why the maximum width is as it is, just to be clear. Perhaps if you could customize the maximum width of the embed itself, not of the images? If you really want smaller images then, just resize them using your preferred image editor like ImageMagick.

Also, Monospace: Thoughts on using tables instead of monospace fonts for the case you gave, at least? If you just ask for another font, then you run into problems when people have small screens, like on phones, anyways. If the text is longer than their screen can handle, then it goes off to another line, which can make aligning very hard even with a monospace font, and... yeah.

While we generally allow minor feature requests on this tracker, I think in this case since there isn't a specific ask but rather a large variety of ideas we'd prefer if this discussion remained on our feedback page. Thanks!

discord / discord-api-docs

Embeds 2.0 #636