Magic Online’s Visual Update to Cards & Zoom

Posted on Jan 21, 2025

By Ryan Spain and Chris Bellach

Article Summary

• Frame Refactor: A major overhaul to MTGO's card presentation, with more realistic foil treatments and improved visual quality
• Hover Zoom: Introduced as the default method for enlarging cards with a simple cursor hover, addressing longstanding usability issues and enhancing the gameplay experience.
• Large Zoom: A new way to view cards in extra-large detail during matches, designed for quick access and usability, particularly beneficial for content creators.
• Temporary Limitations: Old zoom controls are being repurposed, with some functionality temporarily unavailable until the Aetherdrift update.
• Feedback Welcomed: Developers are actively listening to community input via Discord and forums to refine the changes and ensure a smooth user experience.

Greetings, Magic Online friends—Creative Director Ryan Spain, here. We have a big update coming to Magic Online tomorrow, and we want to tell you all about it! One of our major development efforts of 2024 was our "Frame Refactor," which is a major reworking of how we construct our digital cards on Magic Online. Besides making it faster and easier for our team to deliver each new set, the Frame Refactor also improves the authenticity and quality of our card presentation, especially with premium cards.

Given that we were rewriting the code handling the way we construct and display cards, it was also the right time to make improvements to the way we handle card sizing and zooming. With this launch we are also introducing simple "Hover Zoom" as the default method for enlarging cards, and a “Large Zoom” feature for quick access to an extra-big card zoom during a match.

Client engineer and card-construction guru Chris Bellach will walk you through the Frame Refactor, and then I'll take over to review the Hover Zoom and Large Zoom features. Chris, tell them all about what you've been up to for the last year!

The X Refactor

Hi everyone, I’m Sr. Client Engineer Chris Bellach. Refactoring how we display cards on Magic Online has been a passion project of mine since we were developing the game at Wizards of the Coast. I am excited for this project to be a reality, and for cards on Magic Online to start looking their best!

When I started working on the MTGO client, it became quickly apparent to me that we were going to need to come up with a better solution for building cards out of the “parts” we were getting from WotC with each new set. More and more sets were coming out with unique frames, and the old system for incorporating new frames was time consuming and difficult to maintain. With whatever spare time I had, I developed a new system for the task that would be maintainable and allow us to implement new frames quickly. This year we committed to the project, and while it was a long and challenging journey, we reached the finish line and are now ready to switch over.

The new system lets us easily control the different layers of assets used to compile individual versions of a frame, as well as easily control the placement of the text on the frame. This allows us to more faithfully reproduce the look of printed cards on Magic Online. Additionally, we took this opportunity to incorporate the higher-resolution assets, making the cards look crisp. We won’t have all the card art available in high res at the launch—just the most recent sets—but we are working to fill in the back catalog.

This new system also gives us the ability to improve our foiling technology, to make our foils look much more like the printed cards. For the printed cards, Wizards uses a hand-crafted masking layer called a White Under Print (WUP). This is an opacity mask that allows Wizards to fine-tune the foiling of elements of a card based on its art to have the foiling “pop” most effectively. Previously we had a one-size-fits-all approach to the foil treatment, but that produced a foil effect that didn’t feel “premium.” We are now leveraging the bespoke masking that tabletop uses to make each foil special, and the results are stunning! Look at this before and after:

Before

After

I am excited for everyone to see how nice the new system work and look forward to continuing to improve this new system. At launch, we will have most of what we call the M15 frame supported, as well as most of the Borderless Favorites frame and the Haunted Tech frame from Duskmourn.

Zooming into the Future

Thanks Chris! It's Ryan here again, back to tell you about updates to Magic Online's zoom feature.

Magic Online has a ton of cool features, but they aren't always discoverable. In some cases, unaware players are only missing out on a power-user feature that wouldn't have been important to them anyway. In the case of the Magic Online card-zoom feature, though, we have a difficult-to-discover feature that has a significant impact on an unaware player's ability to get the information they need to make their deckbuilding and gameplay decisions. Check out this reddit question:

As a game-maker and steward of Magic Online, this post breaks my heart. If your new users are turning to reddit to learn how to view basic game information, something is amiss. Enlarging cards on demand is a fundamental part of the user experience in any PC collectible card game, and the genre has solved the controls for this: hover your cursor over the card you want to inspect more closely!

Magic Online has always asked for an additional input along with the hover before zooming, and it's a frustrating experience to play Magic Online without knowing how to do this. Players who stick around eventually learn how, but failing to meet player expectations from the start on things like the basic presentation of card information contributes to players deciding Magic Online isn't for them.

Even if you learn the trick and decide to stick with Magic Online, the interface is then asking a lot of you in perpetuity, as inspecting a card more closely requires both keyboard and mouse inputs, or the awkward "press and hold the center mouse button" input, or the extra-awkward "press and hold the left and right mouse buttons" input. No other digital card game I know of asks for such contortions just to read a card! It is past time that Magic Online had modern zoom controls.

Getting It Right

Tuning a Hover Zoom feature comes down to three factors: where does it appear, how big is it, and how long does it take to appear? The trickiest of the three is “time to appear,” as it has to be fast enough that people hovering on a card for information get it promptly, but slow enough that moving your cursor around the battlefield or collection doesn’t constantly pepper you with unwanted zooms. We started out with settings that were reflective of the timing on Magic: The Gathering Arena and tested them during the recent Innistrad Remastered beta. We made some tweaks based on that feedback, and are launching with setting we feel good about. We anticipate further feedback and further adjustments after launch, but as someone who has been playing with the feature a lot for tuning purposes, I already can’t imagine going back to life without hover zoom.

If you try it and disagree, there is an option to turn off hover zoom in the settings. However, until Aetherdrift, turning off Hover Zoom will turn off zoom entirely, and you will have to use right-click to get card information from that context menu. We can’t simply have the old zoom functionality take over when you turn it off, for a couple of reasons. First, the old Zoom code is gone, replaced by the new zoom system, so we can’t just run the old code with hover zoom disabled. Second, we are using the old zoom controls for a new “Large Zoom” function we are also excited about!

Large and In Charge

Also coming in with this update is the “Large Zoom” feature! After a fresh install of Magic Online, the “Preview Window” is on by default. It’s that floating, resizable window that displays whatever card you are hovering over. Most people close this window almost immediately and never reopen it. It’s not that the feature isn’t useful, but if you can’t access it and dismiss it quickly and easily, it might as well not exist because people won’t use it.

Enter Large Zoom! With this launch, the center mouse button and “Q + Hover” controls that previously controlled “normal zoom” will now bring up the Large Zoom during a game. The card zoomed will appear at a large size over the battlefield, and the next click the player makes—anywhere on the screen—dismisses the Large Zoom. Here's Emrakul in "Large Zoom" mode as it will be at launch, but we are going to be making the zoom even larger with Aetherdrift.

This ability to toggle the view quickly takes a feature that almost nobody uses and turns it into a useful way to examine a card. It’s especially great for content creators who want to give their audience a good look at a card in play. Currently, the Large Zoom card appears in the upper left corner and takes up half the height of the window, as in the screen shot above. This was reflective of Arena’s use of this style of zooming, but we want to go bigger. With Aetherdrift, the Large Zoom will move to the center of the screen and take up most of the vertical space, better living up to the "Large Zoom" name!

Temporary Subtraction

Under Daybreak, we have strived to make improvements to Magic Online that are additive: bringing the “new and improved” to the game without removing any of the features that already exist. For a few weeks, we acknowledge that this won’t be the case with Hover Zoom. With the reworking of the zoom code and the repurposing of the previous zoom controls, you will not be able to both disable Hover Zoom and enable the old zoom controls, thus recreating the Before Times of zooming. We know some of you are going to want this style back, so we are already hard at work re-coding the ability to map a keystroke to an input-based zoom control, and we should have that to you with Aetherdrift, barring unforeseen complications.

We will also continue to listen to feedback on the size and delay settings for Hover Zoom, and make further tweaks based on community response. We will not, however, offer personal customization of those settings. Such options are always tempting and sometimes appropriate, but not in this case. Most players don’t mess with settings at all, they accept system defaults, which means we would either have to bury zoom customization features in the settings where they would be seen too infrequently, or put them right on the zoom window itself, where they would be seen too often.

If you disagree and think those controls sound great, consider that no other digital card game with zooming (at least that I know of) offers such controls. While you personally might make use of them, it is a much better game-development practice to refine your settings to be universally solid than to clunk up your UI with custom settings that few people will use.

Zooming Ahead

We are excited about the improvements to card quality and the zooming experience, but we know this is a change that affects every player, and we will be paying close attention to the community feedback in the coming days and weeks. I already can’t imagine playing Magic Online without it, and I hope you all feel the same way after getting some games under your belt.

Let us know what you think of the changes in the Magic Online Discord or the forums, and we’ll be listening!

MTGO Community Links: Forums  Discord  Twitter/X  Facebook  Instagram NEW! BlueSky