9 slice scaling of bitmaps
Why does there seem to be no interest or demand for this feature anymore? For me it's a "must have" for efficient prototyping. I realize "flat" is all the rage, but I still do a lot of photo-realistic, skeuomorphic design using Photoshop's bitmap-only tools. Without 9-slice scaling, there's no way to properly scale a png graphic within XD. I have to create all the different sizes I need in Photoshop and import them all separately. Doesn't anyone else have this problem, or am I missing something?
I realize there's already a post about this, but I'm hoping for some feedback and I doubt commenting on a year old post would get noticed.
I can’t comment on the state of design, but what I can do for you is to merge the other story into this one, which will notify all of the other people who upvoted for it. That being said, it’s likely that people are beginning to go all-vector, which negates the need for bitmap 9-scaling if you have fixed point corners.
Fancy borders are common design elements when doing game design prototyping in XD. I can create components that allow me to make a variety of dialog box sizes out of these types of borders, but it is needlessly tedious.
What I would like to be able to do is combine 8 or 9 bitmaps into one component and set how each individual image scales when I scale the component.
1) Corners would be set to <NO Scaling>
2) Top and bottom edge pieces would be set to <Horizonta Scaling Only>
3) Left and right edge pieces would be set to <Vertical Scaling Only>
As you scaled the component all pieces would remain abutted to each other and the look of the corner details would never scale.
With this set up I could scale this object just like any other Rectangle object where the corner radius always looks the same. This is how 9-Slicing works in UI engines so you can keep the number of bitmaps to a minimum.
I provided an example of the dialog border I am currently working with. The pink lines and numbers are added for you to analyze what pieces comprise this component.
Upvote on this.. really needed feature. I work in games development and we use a lot of bitmap graphics for our UI design philosophy, and want to use a package like Adobe XD to prototype our game designs before we put them into an engine.
What's the latest news on that? Is there any on-going process on development side? placed in roadmap?
Sorry Elaine, three years later and most game engines don't support native vector in UI/UX. arguing with a valid request is a tone deaf response.
Alex Smiles commented
Completely out of touch response. As a game developer this is still (in 2020) extremely necessary. Most engines (unity and unreal) do not even have proper vector support so we have to use bitmaps. This makes using AdobeXD as a place to export my assets from completely nonviable.
John O commented
伊藤弘樹, that's great. I made my own workaround by slicing in photoshop and placing everything the same way, nice to be able to skip a couple steps.
Adobe should still implement it properly into XD though, the alignment is never quite perfect between the slices with workarounds and at some point they have to realize that this is an extremely useful feature that would enable more game developers to use XD.
It is a workaround until the official response.
Why it's not still on a roadmap? Have you spoken with any big game development companies? Vector is far from being sufficient for the industry needs. I'm Senior UI Designer on Star Trek:Fleet Command and I can tell you that we need that feature and I definitely know how to build an efficient UI pipeline. Have not heard that Adobe ever talked to actual UI designers in a game dev industry tho :)
Johnny Waterman commented
Elaine, I'd love to have a conversation with the XD development team about features in the future. Currently, I work at Blizzard Entertainment where we create a lot of physical/painted interfaces and I know I'm not alone there.
As for 9 slicing, it's pretty crucial in the game industry, especially with bitmap images. The XD development team needs to empathize with the various user groups that use XD. 9 slicing bitmaps might not be what 90% of XD users are using it for, but I would say in terms of the Video Game industry as a whole, this would benefit the majority of the industry, an ENTIRE industry. Not everyone that uses XD is making mobile applications or websites with solid color art styles.
XD is amazing, thank you to the dev team! I'm really looking forward to the future of the product.
i mean - 9-slicing is actually very useful in vector graphics from illustrator that you use from your adobe library... I agree with the post and need the feature as well.
I’m a game ui/ux designer and I desperately need that feature
Matt Teeter commented
I am a huge fan of working in vector whenever I can but I too work in the game industry and am continually forced to create all of my assets as bitmaps and to prep, most of them as 9 Slices for file optimization. Being able to use them natively in XD would make my workflow a lot easier. There are also some looks and styles that are just easier, if not, only possible via bitmap
Max Mercier commented
John O: "I can guarantee bitmap is not going away anytime soon. This is important for game development, as you can see from the various comments people are posting here. It's definitely one of the top issues keeping me from designing in XD."
+1 here. Game UI makes heavy use of bitmaps, mainly because of performance issues. Vector graphics don't translate well at all in terms of GPU rendering.
They also don't look good because the rendering context is dramatically different from what we're used on desktop computers (there are no curves as everything is translated to vertices, and there is also no smoothing/antialiasing, at least not anything you'd find comparable)
Ernest Liu commented
"it’s likely that people are beginning to go all-vector"… what?
John O commented
@Elaine I can guarantee bitmap is not going away anytime soon. This is important for game development, as you can see from the various comments people are posting here. It's definitely one of the top issues keeping me from designing in XD.
Ricardo Pinto commented
@Elaine While vector is useful, if you have an element (frame/button) consisting of multiple vector layers, you still can't easily stretch it to the size of the container without going to each layer and editing their nodes individually. What would be ideal here would be a tool similar to the Repeat Grid, where you select an element/group, press a Stretch Grid button and define where the boundaries are, and then resizing that element will use those 9-slice boundaries. If you make it bitmap-only, you're still limiting the usefulness of the tool
@Elaine pipeline with 100% vectors is a total mess because if you have CC Library with 300+ UI elements and 6-7 designers you want to keep all your UI consistent. If you will "copy" vector shapes in each screen (we have 422 screens and states of the screens in our mobile MMO game) your design will become inconsistent in terms of UX patterns and UI patterns as well after only 3-4 weeks of production. That's why we need "instances" (not "copies") of UI elements to be used right from the library or from PNG files that Adobe Generator generates.
We need 10000% guarantee that if one of the designers updates any UI element ant any time - all other designs that contain that element will be updated as well and their authors should be notified. Also, it would be great to have some HTTP hooks for that so our continuous integration(Jenkins) would rebuild our dev version of the product right after UI assets update.
I would love to see this get some attention as for me this is what will define the difference between a true prototyping app or just another wireframing app. Once responsive design is implemented the lack of this feature will effectively block our pipeline due to the fact we cannot utilise our final assets.
I've seen that this was posted already however I’d like to expand on why bitmap 9 slice with responsive elements are important to UI designers.
It has been stated here before by Elaine that “people are beginning to go all-vector, which negates the need for bitmap 9-scaling if you have fixed point corners.”
Although the current trend with material design and minimalism this statement holds true, in the games industry we are often tasked with complex and more flamboyant designs.
As you can see by the attached example, corner pinning will not support our design.
Id like adobe to reconsider the importance of 9 slice bitmaps as you can see the issues it will cause for us designers once responsive elements are implemented.
It is impossible to do advanced Game GUI design without 9-slicing both for stretching and tiling, doesn't matter if it is with vectors or bitmaps. Traditionally it is still done with Photoshop, exporting the pieces as PNGs and putting them together to form the panels in the game UI layout tools.
Without 9-slicing, to create screen mockups various button and dropdown sizes have to made in Photoshop or illustrator first and imported as separate assets. Defining the stretch/tile areas in the mockup tool would be a much better workflow.