![]() The default setting of the component is for Responsive Resize to be turned on, and for the aspect ratio to be unlocked. I then went ahead added the SVG wordmark (which I originally created with AI) as a component (which I still don't quite undersand the benefit of making it a "component," but I did it anyway), and now I can sucessefully resize the SVG component without distortion - as long as the "Response Resize" is turned off AND the ratio is locked. A resolution for me was turning off "Response Resize" (as Peter suggested) and then locking the ratio under the "Transform" label in the side properties panel on the right. Selecting a region changes the language and/or content on 'm just a UX Researcher and the furthest thing from a designer, but occasionally have to do utilize XD and recently I experienced this problem. ![]() I encourage you to try this new capability yourself. ![]() As you can see, I've only begun to scratch the capabilities of the responsive resize feature. In fact, I'll move it up on the screen, and make some room here for some controls towards the bottom. I'll grab my text object and just center that up a bit here. I'll now select the group, and press and drag and I'm getting a much closer representation to what I wanted. I'll come into my 'Play" button and in the manual settings here, I do want it to be fixed in height and width and I'll go ahead and let it also be percentage based as it scales. I'll go ahead and let it remain percentage-based. I can also decide if it should align or be fixed in location to any of the corners of my group set. I can decide should the text scale if it's not fixed in height and width it will scale. I also can come in and change auto mode to a manual mode where I have total control over how the resize behavior happens. If I were working on something like vector content, I could disable responsive resize so that the objects scales proportionately the way it used to before we implemented this feature. You'll notice we have a new section for responsive resize. Once again, I'll hit CMD- or CTRL-z to undo the change and I'm going to come in and click on that title over here in the Properties Inspector. I want the text to scale as my object scales, and I want my play button to remain up higher towards the location. Once again XD does a pretty good job, but there's a couple things I'd like to override or change. So I'll select that set and I'm going to move it to the upper left-hand corner of my design, and just come in to resize the content. Next thing I want to do is focus on this group, which is an image. With that done, I'll come and zoom back in a bit here and I'm going to select my scroll bar and just move that off to the right. I'll start from scratch once I have my design set. Before I do that I'm going to come in, I'm changing this layout enough that I don't want to really rely on the existing design that I have here. Next thing I want to focus on is the image text and this little Play button towards the bottom. Having done that I'll select the header set again and press and drag, and the elements work really well. And I'm going to select the carrier icon and that signal strength icon, and I'm going to group them together by hitting CTRL- or CMD-g. For that, I'll come in and hit CMD- or CTRL-Z to undo that change. What I want to do is give XD a little bit of help to let it know how to align that objec. You'll notice that one of the guesses was not exactly right and that's for my little carrier signal strength here. It by default didn't scale the items, but it kept them aligned left, center, and right. For the most part XD's responsive resize did a really beautiful job. What I'll do is come on in and select the header elements and grab the little control handle here and press and drag it to the larger size. The only solution i found for this has been to manualy decrease the boarder size after shrining down the SVG. XD uses amazing intelligence with responsive resize, and in general letting it do what it wants to do is often a really good idea. Even if responsive resize in XD is selected or not the boarders on vector lines to not respond in size accordingly, weather I'm edditing the SVG in Illustrator or in XD. ![]() I'm going to start by default by just selecting elements in resizing the. So I'll zoom in a bit so that you can see a bit better what I'm doing. Next I want to come in and resize my content. Now, I want this to be a tablet layout, so I'll rename it, and with it selected I'll come into the control panel and change the dimensions. To do that I'll go ahead and click on the phone layout, and I'm going to hit CMD- or CTRL-D to duplicate that second artboard next to the first. I have the iPhone layout and, rather than starting from scratch for the next layout - my tablet layout - I'd like to duplicate this design and just resize the elements. I'm here in Adobe XD and I'm working on a few device-specific layouts for a page I'm designing. That means you can spend more time designing, and less time tediously resizing for the screens and layouts you need. With the response of resize feature in Adobe XD, you can resize groups of objects while maintaining their placement and scalability.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |