Before starting the design, you need to know that mobile apps operate under their own set of rules, different from websites in terms of how the device is held and how buttons are placed.
Mobile apps operate through touch and gestures, used in contexts of movement and adhering to the conventions of each operating system. Transferring a web layout directly to a phone screen is the most common mistake and almost always leads to a poor experience. Proper app design starts with one task per screen, ensuring touch targets are large enough for fingers and respecting the platform standards users are accustomed to.
A mobile app is not just a smaller website, especially when the app is a real tool for interaction rather than just a responsive version of an informational page. The difference lies not in screen size but in how users hold the device, how they interact, and their expectations for each operating system. Understanding this before commissioning a design will help you avoid a series of costly revisions later.
First is the interaction method. The web uses a mouse and keyboard, while mobile apps use fingers: tap, swipe, drag, zoom, long press. Gestures need to be easy to discover and consistent; otherwise, users will overlook features because they do not know they exist.
Second is the target touch size. On the web, a small link of 12px can still be clicked with a mouse pointer. On mobile, a target that is too small leads to continuous misclicks, and misclicks are something users do not easily forgive.
The third factor is the context of use. The app is often opened while on the go, with one hand holding the device, outdoors in bright sunlight, with unstable networks, and easily interrupted by calls or notifications. The design needs to reflect this reality with a simple screen, clearly designed waiting states and errors, not just focusing on the interface when everything is working well.
Fourth is the hardware of the device. Apps can leverage the camera, location, push notifications, facial recognition, and offline capabilities. The web typically cannot achieve this at the same level. However, Sinh Vũ recommends utilizing hardware only when the core feature truly requires it, not just to integrate for the sake of it.
iOS and Android each have their own set of conventions that users have learned over many years of using devices. Apple bases its design framework on the Human Interface Guidelines (Apple's official user interface guidelines) with three axes: clarity, content prioritization, and subtle depth. Clarity here means removing ambiguity from every interactive element, not just a clean-looking interface.
Google pursues Material Design (Google's cross-platform design system) with strong visual hierarchy and physical surface metaphors. The approach of the two companies is distinctly different in how they place the navigation bar, back button, and screen transition styles.
iOS users are accustomed to iOS, while Android users are accustomed to Android. When designing mixes conventions from both platforms, users will feel lost even if they cannot articulate the reason.
Practical experience of Sinh Vũ
Small screens and users are easily distracted. The Nielsen Norman Group emphasizes that on mobile, a primary task should be prioritized on each screen, gradually revealing complexity, as users find it difficult to handle multiple options simultaneously while on the move. This is a design principle based on research, not just aesthetic preference.
On the web, a page can contain a main menu, main content, sidebar, and footer and still be usable because of the wide screen and users sitting still. On an app, a similar layout can become a chaotic mess that's hard to navigate.
If you need an app for regular use as a work tool: Invest in a custom design according to platform standards, not by reusing the website layout. The flow, screens, gestures, and design system need to be calculated from the start for the mobile context.
If you only need a mobile version of an informational page: A responsive website is usually sufficient and significantly more cost-effective than building a separate app. Not everything needs to be an app.
Sinh Vũ focuses on the right strengths in app design: user flow, screen architecture, gestures, design systems, and brand consistency on each screen. Sinh Vũ designs according to platform standards so that users feel familiar, then hands over specifications and design assets to your development team. The foundational technical aspects are handled by your technical team or partners, while Sinh Vũ collaborates closely to ensure the interface aligns with the intended vision.
Topic: How mobile app design differs from web design. Sinh Vũ guide, sinhvu.com
Tick each item that applies or that you can already answer, then print or save as PDF to take with you.
If you have marked most of the signs above, this is the time to discuss in more detail. Sinh Vũ can help you review and propose a direction.
Apple Human Interface Guidelines (developer.apple.com); Google Material Design (material.io); Nielsen Norman Group, research on mobile UX and progressive disclosure.
Yes, if the two channels serve different purposes. An app is often a tool for frequent interaction, while a website is typically a place for research or introduction. The layout, flow, and organization of information for these two channels need to be designed separately, even though they may share the same color scheme and brand language.
It is not necessary to design two completely different versions, but adjustments should be made according to the conventions of each platform. iOS and Android have different navigation button placements, screen transitions, and some default gestures. iOS users are accustomed to iOS, and vice versa; mixing conventions will make them feel lost even if they cannot articulate why.
This article is for reference. The scope, pricing, and specific commitments of Sinh Vũ are detailed in the proposal and signed contract.