Visual Design

RSS for tag

Discuss animation, branding, color, layout, typography, and other elements of great looking apps.

Posts under Visual Design tag

34 Posts
Sort by:
Post not yet marked as solved
1 Replies
363 Views
The color of the UIMenu in my application has changed from light to dark when I upgraded my device to iOS 15. Do I need to override a property or write other code in order to keep the color of the UIMenu consistent with other iOS versions?
Posted Last updated
.
Post not yet marked as solved
2 Replies
214 Views
Dear Experts, I have been looking at the documentation for system colours at https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/ https://developer.apple.com/documentation/uikit/uicolor/standard_colors/ https://developer.apple.com/documentation/uikit/uicolor/ui_element_colors It's all reasonably clear... until I actually look at some UIKit screens and try to work out which colour is being used where. For example, what colour is the background of a navigation bar? It does not seem to be one of the standard colours. Attached is a screenshot from "UIKit Lab", which is a free UIKit catalogue/demo app. Scrolling through its list of standard colours, none of them seems to match the background of the navigation bar. It lies somewhere between systemBackground and secondarySystemBackground. Is this perhaps because the base colour has been modified by a material effect, or something? Thanks, Phil.
Posted
by endecotp.
Last updated
.
Post not yet marked as solved
1 Replies
792 Views
Hi! I am working on the UI/UX project for Apple apps(iPhone/watchOS etc.) using FIGMA. I don't have any Apple device from where I could use 'SF Font' family natively. I have tried the alternative fonts but none of them appealed to me and my client too. I also downloaded their resources but still it changes the file after I edit the text. Thanks in Advance.
Posted
by aman1.
Last updated
.
Post not yet marked as solved
0 Replies
129 Views
I downloaded the macOS 12 App Icon Photoshop Template here: https://developer.apple.com/design/resources/ and when I modify the larger size that I need, changes are not showing on the other sizes. I downloaded the iOS template and the macOS template for Sketch and those work, but not Photoshop template.
Posted Last updated
.
Post not yet marked as solved
1 Replies
177 Views
Hi there, does Apple allow to embed Animojis in your app? We are developing a learning app and want to use one specific animoji as a "brand ambassador" who is presenting the information. Was wondering whether there are any trademark issue with this or whether Apple is just fine with it? Any experiences and thoughts are much appreciated! Stephan
Posted
by Kasdude93.
Last updated
.
Post not yet marked as solved
0 Replies
204 Views
I am facing an odd problem with the global accent color in a macOS application targeting macOS 11 +. The color is defined in an asset catalog and its name is set as the value of the key Global Accent Color Name in the project's build settings. Despite this, the custom accent color is not applied uniformly throughout the application when the system accent color is set to multicolor. Anywhere where NSColor.controlAccentColor is used explicitly either in code or interface builder, the color is correct. However, wherever the use of the accent color (or its variants) is implicit, the blue system accent color is used instead. This includes the selection in NSMenus, the selected state of NSSegmentedControls, the selection NSOutlineView using the source list style, NSSwitch, NSPopUpButton, NSButton, etc. This problem occurs in both light and dark modes, on macOS 11 and macOS 12. I have compiled the application with Xcode 12.5, and multiple versions Xcode 13. I have found that modifying the system accent color to something other than multicolor and then back to multicolor fixes the problem, but only until the application is quit. At the next launch, the problem reappears.  I have tried all sorts of changes such as: Setting the value directly in info.plist Adding the value in an xconfig file: with the key ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME Forcing views to redraw Renaming the color in the asset catalog Creating a minimal application in an attempt to reproduce the problem. The closest I have come to a solution is investigating in detail the effective appearance of the application, from the property NSApplication.sharedApplication.effectiveAppearance.  The object returned is of the class NSCompositeAppearance. It contains an array of 2 appearances: an NSAquaAppearance or NSDarkAquaAppearance and an NSSystemAppearance.   Two private properties of NSAquaAppearance/NSDarkAquaAppearance are of interest: _tintColor and _cachedNormalizedBezelTintColor. These properties seem to set the color of standard controls. In my problematic application, _tintColor returns the system blue accent color. In other applications without these problems, _tintColor points to the color defined in the asset catalog. _cachedNormalizedBezelTintColor seems derived from _tintColor.  Using key-value coding, I am able to modify these properties and change the appearance of most but not all controls, buttons, and selections. However, I do not want to use private properties and this is just masking the symptom of the real problem. Has anyone experienced this problem with the global accent color? What was the solution?
Posted
by Emilia_S.
Last updated
.
Post not yet marked as solved
1 Replies
182 Views
My macOS SwiftUI project has minimal target 10.15 (Catalina). When I run a build made in Xcode 13.1 on Catalina there are multiple ui issues (views has wrong dimensions, list items has wrong offsets), however when I run same project in Xcode 12.4 on the Catalina laptop issues are gone. Since I cannot replicate the issues in Xcode 12.4 I have no ideas how to tweak my Xcode 13.1 build to make it work correct on Catalina devices. I cannot use Xcode command line tools 12.4 in Xcode 13.1 and vice versa 🤷🏻‍♂️
Posted
by Sintezz.
Last updated
.
Post not yet marked as solved
0 Replies
129 Views
We would like to re-brand an existing app but continue allowing downloads for the old branded app as it's tied to print media that will be around for many years. Is this permissible? I was told it is not without any details, but my research says otherwise. They are completely different brands, logos and company names but the same app.
Posted
by ColleenG.
Last updated
.
Post not yet marked as solved
0 Replies
192 Views
I have created the main view of my app and there is a button that will display a pop-up view doing some user input tasks. I would like the background dim view to fade in and fade out while the pop-up view is using scale animation in transition. The animation works pretty well while showing the view, but it does not work when it disappears. Following is my code that is relative to this problem. There is a button in the main view that will toggle isAddViewShown to display the pop-up view, and there are two buttons that will close it. So I passed the action into the pop-up view as shown, but it did not work. I'm pretty new to SwiftUI so I'm not sure whether that is what I'm supposed to do. Is there any way to let the animation work as designed? public struct SMMainView: View { @State private var isAddViewShown: Bool = false public var body: some View { ZStack { /* Some other views */ // This is actually a dim view using opacity animation in transition if isAddViewShown { Color.black.opacity(0.5) } // This is a customized pop-up view using scale animation in transition if isAddViewShown { SMAddView(onCreate: { name, description in /* do some extra operations with name and description */ withAnimation(.easeInOut(duration: 0.25)) { isAddViewShown.toggle() } }, onClose: { withAnimation(.easeInOut(duration: 0.25)) { isAddViewShown.toggle() } }) .transition(.scale) } } } } To avoid misunderstanding, the following is basically what I put for the pop-up view. struct SMAddView: View { @State private var name: String = "Title" @State private var description: String = "Please Enter description." private var createAction: (String, String) -> Void private var closeAction: () -> Void var body: some View { VStack { TextField("", text: $name) TextEditor(text: $description) Button(action: { createAction(name, description) name = "Title" description = "Please enter description." }) { Text("Create") } Button(action: { closeAction() name = "Title" description = "Please enter description." }) { Image(systemName: "xmark.circle") } } } init(onCreate create: @escaping (String, String) -> Void, onClose close: @escaping () -> Void) { createAction = create closeAction = close } }
Posted Last updated
.
Post not yet marked as solved
0 Replies
188 Views
Hi community, I want to share with you this small utility to resize your App Icons according to the Apple Human Interface Guideline. I created this a long time ago for personal use and now I want to make it public. Hope you can find it useful, it's simple but it is a time saver. https://appiconmaker.bateriasincluidas.com/ Cheers!
Posted
by Nicoli.
Last updated
.
Post not yet marked as solved
0 Replies
217 Views
I've searched all over and I am having trouble finding the menu/sidebar list selection background specifications. Dark Mode Sidebar Focused Light Mode Sidebar Focused Dark Mode Sidebar Unfocused Light Mode Sidebar Unfocused Dark Mode Menu Light Mode Menu It is not a solid blue background. It is a combination of blend modes and opacities that differ in light and dark mode that I would like specifics on because I am having to create something custom and I'd like it to match the rest of my application I am working on. Is there perhaps a variable that applies this background that I am not finding? You can find more information for our usage of this in our discussion here. I found some things but I do not know how accurate they are. Any help on this would be great. Thanks!
Posted Last updated
.
Post marked as solved
7 Replies
3.3k Views
Hi, I would like to ask how to change fontWeight of a button label within ButtonStyle. However I can't figure it how to do it. This is my code: struct CapsuleButtonStyle: ButtonStyle {     func makeBody(configuration: Self.Configuration) -> some View {         configuration.label             .font(.footnote)             .fontWeight(.bold) /* All modifiers work except this one*/             .foregroundColor(.white)             .padding(.horizontal, 11)             .padding(.vertical, 6)             .background(Color.blue)             .cornerRadius(.infinity)     } } Thanks for your help
Posted Last updated
.
Post not yet marked as solved
1 Replies
600 Views
What animation program do most developers or designers use for adding animations to their apps? I am a graphic/UI designer and have been working with XCode lately to develop an app. I would like to add animations to buttons, menus, and even full blown instructional animations for the user on how to use our products. I have used CoreAnimator, Adobe Animate and struggled with both. Adobe animate has issues with sizing for different devices and I have been working with them for months now trying to resolve the issue as it doesn't seem to be the constraints in Xcode. I am not the best at coding but I am willing to learn. Do I need to learn Core Animation code to be able to animate buttons menus etc? Or are libraries easier? As for the full blown instructional animations I feel like that would be more a long the lines of something similar to Adobe Animate? TIA!
Posted Last updated
.
Post not yet marked as solved
1 Replies
344 Views
Hello, I m one of the developers of the My CM app team (Belgian Health Insurance company). While testing on apple devices that have no physical homebutton, but the on-screen "black bar" we notice some strange behaviour. See picture attached. The phone on the left is a iPhone 13 Pro Max, the one on the right is an iPhone XR. Both have ios 15.2. Both phones have the same build of our app. On the Pro Max the black bar is on top of our layout, on the XR our layout seems to be pushed up a bit. The desired behaviour is the behaviour on the XR. Can somebody give us advice on how to handle this issue? Kind regards, Lode
Posted
by XayideBE.
Last updated
.