{"id":15102,"date":"2022-02-11T11:00:57","date_gmt":"2022-02-11T10:00:57","guid":{"rendered":"https:\/\/phraseapp.com\/blog\/?p=1907"},"modified":"2023-11-20T17:08:31","modified_gmt":"2023-11-20T16:08:31","slug":"app-localization-developers-guide-to-user-experience","status":"publish","type":"post","link":"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/","title":{"rendered":"UX Localization: Adapting the User Experience for International Audiences"},"content":{"rendered":"<p>A visually appealing app is hardly worth anything without a strong user experience (UX). This is why UX design appeared on the tech map in the first place. However, what&#8217;s relatively new is UX localization\u2014the skill of adapting UX for different markets.<\/p>\n<p>Giving users the feeling of comfort, familiarity, and ease of use in whichever corner of the globe they may be is what helps the world\u2019s most popular apps such as Facebook or Airbnb stay popular\u2014and profitable. The good news? You can do it too.<\/p>\n<p>UX localization is about much more than just UX design. It\u2019s about crafting cross-cultural products with international UX in mind from the start of the development process. Let\u2019s explore how you can also build the impact of localization on UX into your app.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_69_1 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Overview<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#whats-user-experience-ux\" title=\"What\u2019s user experience (UX)?\">What\u2019s user experience (UX)?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#what-isnt-user-experience\" title=\"What isn\u2019t user experience?\">What isn\u2019t user experience?<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#ux-localization-adapting-user-experience-to-local-expectations\" title=\"UX localization: Adapting user experience to local expectations\">UX localization: Adapting user experience to local expectations<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#ux-ui-and-usability-in-app-localization\" title=\"UX, UI, and usability in app localization\">UX, UI, and usability in app localization<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#before-ux-localization-the-role-of-international-ux-design\" title=\"Before UX localization: The role of international UX design\">Before UX localization: The role of international UX design<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#1-ensuring-usability-in-every-market\" title=\"#1 Ensuring usability in every market\">#1 Ensuring usability in every market<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#2-internationalizing-the-app\" title=\"#2 Internationalizing the app\">#2 Internationalizing the app<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#3-identifying-non-textual-ui-elements-for-localization\" title=\"#3 Identifying non-textual UI elements for localization\">#3 Identifying non-textual UI elements for localization<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#4-content-localization\" title=\"#4 Content localization\">#4 Content localization<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/phrase.com\/blog\/posts\/app-localization-developers-guide-to-user-experience\/#how-technology-can-influence-the-success-of-ux-localization\" title=\"How technology can influence the success of UX localization\">How technology can influence the success of UX localization<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"whats-user-experience-ux\"><\/span>What\u2019s user experience (UX)?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>App user experience is all about how a person perceives, thinks about, and interacts with an app, be it web or mobile. It encompasses a variety of elements, from the design and the user interface (UI) to the app\u2019s documentation and how it responds to a user\u2019s behavior.<br \/>\nUX is typically the one thing that makes or breaks the success of your app\u2014if users don\u2019t see value in your app, or have fun using your app, or get something out of it that they appreciate, they won\u2019t use it. Your software will become shelfware. All the days you spent coding and testing will have been for nothing.<br \/>\nIt could also be the case that your app is technically perfect, but only for the users in your own country. The moment your app becomes international, a whole new set of challenges arise. That\u2019s when UX localization comes in.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"what-isnt-user-experience\"><\/span>What isn\u2019t user experience?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Before we talk more about international user experience, let\u2019s address a few things that user experience is not. UX isn\u2019t:<\/p>\n<ul>\n<li>A marketing or UX specialist\u2019s only responsibility, or a touchy-feely domain involving users \u201con the other side of the wall.\u201d<\/li>\n<li>A vertical slice of the whole product, or something you do after you\u2019ve finished building your app.<\/li>\n<li>Visual design or making things look pretty. A visually pleasing product can still have poor UX.<\/li>\n<li>A gut feeling that you get while using your own app. UX designers apply user research, data, user testing, and analysis before they make any decisions.<\/li>\n<li>Web development. While coding remains the technical foundation of any app, UX is about anticipating how the user will interact with that code and designing the experience accordingly.<\/li>\n<li>Just for the users in your own country. UX has international implications, too, as culture and language play a prominent role in shaping how your users think and behave.<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"ux-localization-adapting-user-experience-to-local-expectations\"><\/span>UX localization: Adapting user experience to local expectations<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>It\u2019s common to think of <a href=\"https:\/\/phrase.com\/blog\/posts\/mobile-app-localization-why-and-how\/\">app localization<\/a> as simply replacing your app\u2019s text strings with words in another language. However, what localization truly means is:<\/p>\n<ul>\n<li>Fitting your app\u2019s content to the cultural tastes and usage habits of the target market rather than performing a word-for-word translation<\/li>\n<li>Using the correct number conventions and currencies<\/li>\n<li>Adapting the user interface to the different space requirements of each language<\/li>\n<li>Verifying the cultural appropriateness of graphics, visuals, colors, and icons<\/li>\n<li>Adapting your app\u2019s UX to what\u2019s expected locally, i.e., tailoring the experience for international users according to regional norms, expectations, thought processes, and language.<\/li>\n<\/ul>\n<p>The last point is where UX localization comes into play, and where developing empathy with your users is essential. You need to be able to understand when something can detail the user experience for native speakers\u2014even if it looks like a small detail from a non-native speaker\u2019s point of view.<br \/>\nWhen all departments\u2014Development, Marketing, Product Management, Design, etc.\u2014work hand-in-hand, they can design and develop outstanding apps. Combining efficiency in coding with excellence in user experience, these apps can boost sales, user adoption, and customer loyalty wherever in the world they are made available.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"ux-ui-and-usability-in-app-localization\"><\/span>UX, UI, and usability in app localization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To position things properly for what follows, let\u2019s see why UX, UI, and usability are different. Of the three, only UXencompasses the whole range of impressions, feelings, likes, or dislikes that users have when using your app.<br \/>\nThat doesn\u2019t mean the UI and usability aren\u2019t important. The UI must offer access to functionality that\u2019s of value or of interest to the user. The app and its UI must also display good usability by being clear and simple to use, pleasing to the eye, easy to learn, and efficient (as in the minimum necessary number of taps, swipes, or clicks) in taking users where they want to go.<br \/>\nUX groups together the quality of the UI and the level of usability, and then adds further aspects: For app localization, for example, this includes the correct use of colors, symbols, backgrounds, and indications of direction (how to navigate a localized page). In short:<\/p>\n<ul>\n<li><strong>Usability: <\/strong>How easy it is to use your app, i.e., how well a user in a particular context can use your app to achieve a specific goal effectively, efficiently, and without frustration. <a href=\"https:\/\/www.nngroup.com\/articles\/usability-101-introduction-to-usability\/\">The five principles of usability<\/a> are learnability, efficiency, memorability, errors, and subjective satisfaction.<\/li>\n<li><strong>User interface:<\/strong> Everything that the user sees and touches, like the touch-sensitive controls\u2014and their layout on a screen\u2014that allow the user to interact with the app\u2019s content and features. Other UI elements include the navigation, the layout, the use of white space, the visual hierarchy, the buttons, the copy, etc.<\/li>\n<li><strong>User experience:<\/strong> The totality of the user\u2019s feelings, perceptions, and many interrelated cognitions (e.g., beliefs, attitudes, intentions, preferences) about the app that result from the level of usability, the quality of the UI, and the appeal of the content and features.<\/li>\n<\/ul>\n<p>When you localize the UX, you\u2019re ensuring that international users will perceive your app in the same way as your domestic customers.<\/p>\n<div class=\"p-message_pane_message__message_label c-message_kit__labels c-message_kit__labels--light\">\n<div class=\"c-message_kit__gutter\">\n<div class=\"c-message_kit__gutter__right\" role=\"presentation\" data-qa=\"message_content\">\n<div class=\"c-message_kit__blocks c-message_kit__blocks--rich_text\">\n<div class=\"c-message__message_blocks c-message__message_blocks--rich_text\">\n<div class=\"p-block_kit_renderer\" data-qa=\"block-kit-renderer\">\n<div class=\"p-block_kit_renderer__block_wrapper p-block_kit_renderer__block_wrapper--first\">\n<div class=\"p-rich_text_block\" dir=\"auto\">\n<div class=\"p-rich_text_section\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<h2><span class=\"ez-toc-section\" id=\"before-ux-localization-the-role-of-international-ux-design\"><\/span>Before UX localization: The role of international UX design<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>When an app is international in scope and the product is available in multiple language versions, it\u2019s important to plan how to cater to international users from the very beginning, long before localization begins.<br \/>\nThe<a href=\"https:\/\/phrase.com\/blog\/posts\/how-to-create-good-ux-design-for-multiple-languages\/\"> internationalization of user experience<\/a>, also called cross-cultural UX design, is about laying the groundwork for the app or website to meet global users\u2019 needs and expectations. Are they used to electronic wallets? Do they swipe left to go back, instead of right? Do they prefer cluttered screens or minimalistic ones?<br \/>\nThese are all things that international UX design takes into consideration. That\u2019s why internationalizing UX design involves more than just making sure that the core functions of your app work across different languages and regions.<br \/>\nInternational UX design also involves combining usability, UI, and localization best practices:<\/p>\n<ul>\n<li>For usability, a cross-cultural design could mean letting the user choose which language they want to use instead of imposing a language based on the user\u2019s geographic location.<\/li>\n<li>For UI, it could mean allowing users to change their own preferences (e.g. to turn on dark mode, to arrange elements as a list or a grid, etc.).<\/li>\n<li>For localization, a cross-cultural UX design could mean allowing the local currency symbol to be displayed next to the price, not leaving untranslated text in images, and supporting local payment methods.<\/li>\n<\/ul>\n<p>It can be useful to think of this cross-cultural UX design process as comprising four steps. Let\u2019s break them down.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"1-ensuring-usability-in-every-market\"><\/span>#1 Ensuring usability in every market<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Steve Krug wrote his book <a href=\"https:\/\/www.peachpit.com\/store\/dont-make-me-think-revisited-a-common-sense-approach-9780321965516\">\u201cDon\u2019t Make Me Think\u201d<\/a> to help people think like a usability expert (a large part of creating the UX), even if they have a different job role, like being a developer. He aimed his ideas at web applications, but they carry over naturally to mobile apps too.<br \/>\nAmong some of his pithy suggestions are:<\/p>\n<ul>\n<li><strong>Don\u2019t make people think.<\/strong> People typically don\u2019t want to have to puzzle over apps to get what they want out of them.<\/li>\n<li><strong>Apps should explain themselves at a glance<\/strong>\u2014from the first screen onwards.<\/li>\n<li><strong>Don\u2019t waste people\u2019s time.<\/strong> Keep the text short and sweet, and minimize distances over layouts and through menus.<\/li>\n<li><strong>The back button is good.<\/strong> If people guess, don\u2019t penalize them. Let them back out again easily.<\/li>\n<\/ul>\n<p>Further care is needed when it comes to app localization. The usability of your app is likely to have been created according to your own cultural norms. However, what may seem natural in one culture may look strange or different in another.<br \/>\nFor example, this conceptual difference could affect the UX of a localized version of your app in terms of:<\/p>\n<ul>\n<li><strong>Forms for user input. <\/strong>Some cultures often offer two fields for users to enter their names: given name and family name. Elsewhere, like in Spain, there are two fields for the family name because people use both their father\u2019s and mother\u2019s surnames. If you insist on applying the same logic to all international versions of your app, you are \u201cmaking users think,\u201d which from a UX standpoint is not the way to go.<\/li>\n<li><strong>Symbols, icons, and colors.<\/strong> <a href=\"https:\/\/www.sciencedirect.com\/science\/article\/abs\/pii\/S1071581921001063\">Research shows<\/a> that implementing culturally preferred design elements can positively influence usability. This could apply to choices as seemingly small as colors. For example, in far Eastern countries like China, the color red is often used to suggest good luck (unlike Western countries, where people may be more likely to interpret it as a sign of danger). A company that picked up on this was Uber: They understood that Chinese consumers could be lured by the color red, so they made their app\u2019s car icons red in China.<\/li>\n<li><strong>Information architecture and navigation structure. <\/strong>Different cultures mean different ways of getting around apps. In fact, <a href=\"https:\/\/www.sciencedirect.com\/science\/article\/abs\/pii\/S1071581921001063\">empirical studies show<\/a> differences in task completion rates across cultures depending on the use of deep vs broad page navigation structures. Heatmaps also show that some cultures focus on textual menu items while others scan the whole page before engaging with it.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-16232 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-traditional-ux-design.png\" alt=\"UX localization in 4 key stages: traditional UX design overview | Phrase\" width=\"1280\" height=\"669\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-traditional-ux-design.png 1280w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-traditional-ux-design-300x157.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-traditional-ux-design-1024x535.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-traditional-ux-design-768x401.png 768w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"2-internationalizing-the-app\"><\/span>#2 Internationalizing the app<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>The user interface is another UX element that must be designed with localization in mind. It\u2019s usually the place where international users are most likely to notice localization issues, so it must be designed to consider internationalization best practices.<\/p>\n<h4>Considering language length and font sizes<\/h4>\n<p>Foreign language equivalents of texts in your own language will tend to be either shorter or longer. In some cases, the difference can be dramatic. For example, the word \u201cuser\u201d in English is usually translated to \u201cBenutzer\u201d in German (twice as many characters) and \u201cutilisateur\u201d in French (almost three times as many characters).<br \/>\nClearly, trying to squeeze all these extra letters into a space tailor-made for the shortest version will cause problems with display and layout, usability, and therefore UX.<br \/>\nMinimum font sizes that work (just) with languages like English may make other more complex language characters unreadable: \u6f22\u5b57, for instance. Additionally, line height used for English or similar Western languages may be too small for Chinese and other languages needing greater line heights. Whatever the font size or line height, the characters for any localized language must be readable. This may mean increasing minimum values for all language versions or possibly using different layout criteria for different locales.<\/p>\n<h4>Using double-length pre- or pseudo-localization to find problems<\/h4>\n<p>Word length problems caused by volume expansion as in the English\/German\/French example above can be detected by making a double-length version of separated text strings and displaying this double-length version. Text overruns will be much more obvious.<br \/>\nHowever, for app localizations that lead to volume contraction (English to Chinese, for example), the services of a native speaker with an eye for layout may be indispensable to identify where too much blank space is being generated and where fields, buttons, or layouts may need to be modified.<br \/>\nIf your app runs on a PC or via a PC browser, using a keyboard, watch out for hotkey or macro-style key combinations that may not be available on keyboards for other languages. You may find it better to use function keys (F1, F2, F3, etc.) which are often available no matter which keyboard is being used. Alternatively, avoid this kind of hotkey functionality from the design stage onwards.<\/p>\n<h4>Handling app localization UX issues caused by layouts<\/h4>\n<p>A localized version of an app can lead to unsightly changes in layout, even when automatic adjustment is used (like Auto Layout in iOS.) The examples in the previous section indicate why this can happen. A layout that is lined up nicely in the default language may become distorted as it struggles to display foreign language equivalents.<br \/>\nEfforts to standardize on one set of dimensions for a language with medium space requirements may not work either, especially when volume expansion and contraction can double or halve text lengths, respectively. The best solution or compromise may be different in each case. It\u2019s likely you will only recover a reasonable UI and UX that works for different localizations by trying different options and getting a native speaker\u2019s input.<br \/>\nHowever, some options might include:<\/p>\n<ul>\n<li>Using dropdown menus to disguise length differences (this may lead to more clicks\/taps being required, thus degrading usability).<\/li>\n<li>Dynamic layouts that display longer texts on two lines instead of one (visually, this may look inconsistent between different locales).<\/li>\n<li>Programmatic changes to layouts, driven by the language or locale (country\/language combination) of the localization. This is a possible solution to the changing number of name fields between different localizations\u2014see the usability section above.<\/li>\n<\/ul>\n<h4>Supporting right-to-left and left-to-right languages<\/h4>\n<p>Right to left (RTL) languages such as Arabic and Hebrew not only change the direction of text compared to English, for instance, but they also change notions of time and sequences of actions. RTL native language speakers may therefore expect to see a \u201ctrash can\u201d on the left of the screen, rather than the right because that\u2019s where they naturally end up before taking final action to throw something away.<br \/>\nSimilarly, \u201cnext\u201d and \u201cback\u201d buttons will logically be on the left and the right, respectively, instead of on the right and the left, as in English language screens. In RTL displays, time runs from right to left. Watch out also for icons used to indicate functions such as text justification. They too will need to read from right to left, for example, with a \u201cragged left\u201d icon, instead of a \u201cragged right\u201d one.<br \/>\nApp interfaces that are highly dependent on lateral movement to make their logic and user experience work properly for LTR languages may need to be rethought and redesigned for RTL languages if the same quality of UX is to be achieved.<br \/>\nThis is yet another aspect that\u2019s best handled in the initial design phase, rather than trying to change an existing app. Sometimes you will not have the choice. However, if you are in the fortunate position of starting to design a new app, you can take these aspects into account, according to the different localizations you think you will require. You can also avoid the issue by using a vertical navigation design from the start, which obviates the need to start either from the left or the right.<\/p>\n<h4>UX writing with localization in mind<\/h4>\n<p>When UX writing is done with global audiences in mind, achieving a consistent international user experience gets easier.<br \/>\nTo make your international <a href=\"https:\/\/phrase.com\/blog\/posts\/writing-10-best-practice-tips-on-how-to-write-global-ready-content-for-localization\/\">UX writing work localization-friendly<\/a>, do the following:<\/p>\n<ul>\n<li>Remove colloquial language from your English text<\/li>\n<li>Ditch idioms and phrases that don\u2019t translate well or at all across languages<\/li>\n<li>Write unambiguous text to prevent users\u2019 (and translators\u2019) confusion<\/li>\n<li>Standardize the terminology used throughout the app<\/li>\n<li>Avoid homonyms<\/li>\n<li>Rely on term bases and glossaries<\/li>\n<li>Write short and concise user interface copy<\/li>\n<li>A\/B test your UX writing to validate the international results<\/li>\n<\/ul>\n<p>The importance of considering future localization during UX writing derives from a tenet that holds true for all globalized products: Internationalization is an investment in localization. If internationalization is done well, localization will be more straightforward and less costly because you won\u2019t need to rework any aspects of your app to make it fit for a different market.<\/p>\n<h4>Other app internationalization considerations<\/h4>\n<p>On top of all these localizable items, there are also other internationalization best practices to ensure a truly cross-cultural user experience:<\/p>\n<ul>\n<li>Ensuring support for local currencies, units, dates, time, and address formats<\/li>\n<li>Choosing the appropriate decimal and thousand separators<\/li>\n<li>Using Unicode UTF-8 encoding to support international text and symbols<\/li>\n<li>Setting the right time zone for each market<\/li>\n<li>Formatting calendars correctly (in some cultures, the week starts on Monday, in others it starts on Sunday)<\/li>\n<li>Ensuring that international phone numbers are formatted correctly<\/li>\n<li>Considering the prevalent hardware and operating system in the target market and adjusting the UI accordingly<\/li>\n<\/ul>\n<p>When all these internationalization and localization best practices come together, you will provide a user experience that is both truly international and tailored to the specific needs of your user base.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-16235\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-app-i18n.png\" alt=\"UX localization in 4 key stages: app internationalization overview | Phrase\" width=\"1280\" height=\"669\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-app-i18n.png 1280w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-app-i18n-300x157.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-app-i18n-1024x535.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-app-i18n-768x401.png 768w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"3-identifying-non-textual-ui-elements-for-localization\"><\/span>#3 Identifying non-textual UI elements for localization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Providing exceptional user experience when launching an app in a new market will inevitably require that culturally relevant elements are localized. Before that happens, however, first you need to identify them.<br \/>\nHere\u2019s an overview of the most common non-textual elements you\u2019ll benefit from localizing:<\/p>\n<ul>\n<li>Images depicting people, animals, symbols, places, and objects that are culturally relevant in the target market<\/li>\n<li>The color palette used in the UI, to avoid the negative connotations of certain colors in some markets<\/li>\n<li>The layout, visual hierarchy, and information architecture<\/li>\n<li>Animation and video used in onboarding screens and tutorials<\/li>\n<li>Awards and badges displayed on the app\u2019s store information page, to make them locally relevant<\/li>\n<li>The use of white space<\/li>\n<li>Call-to-action buttons<\/li>\n<li>Font size<\/li>\n<li>The internal and external links on the app\u2019s website, to avoid sending international users down the wrong path, etc.<\/li>\n<\/ul>\n<p>Even strategic considerations such as the payment methods available at checkout and the frequency at which international users will be prompted to make in-app purchases will need localization considerations. This is why devising a <a href=\"https:\/\/phrase.com\/blog\/posts\/how-important-is-localization-for-your-business\/\">well-thought-out localization strategy<\/a> early on in the app\u2019s development process is critical to a successful international user experience.<br \/>\nFor a practical example of a company that got the non-textual localization aspect right, think of Airbnb. Their home screen includes an \u201cExplore nearby\u201d section that enables international users to instantly find the most relevant places to stay in their current location. This includes illustrations of local attractions, such as famous landmarks\u2014nearby attractions will inevitably vary by country and city, and this is an aspect to keep in mind for future localization.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-16236\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-identifying-non-textual-ui-elements.png\" alt=\"UX localization in 4 key stages: identifying non-textual UI elements | Phrase\" width=\"1280\" height=\"669\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-identifying-non-textual-ui-elements.png 1280w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-identifying-non-textual-ui-elements-300x157.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-identifying-non-textual-ui-elements-1024x535.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-identifying-non-textual-ui-elements-768x401.png 768w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/p>\n<h3><span class=\"ez-toc-section\" id=\"4-content-localization\"><\/span>#4 Content localization<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Now is the time to adapt the non-textual elements identified in the previous step and also <a href=\"https:\/\/phrase.com\/blog\/posts\/best-practices-for-text-components-in-mobile-design\/\">localize the text components of your app<\/a>: headings, body copy, error messages, onboarding screens, tutorials, and more.<br \/>\nThis stage also includes all content outside your app, such as:<\/p>\n<ul>\n<li>App store descriptions<\/li>\n<li>User-generated content (e.g., reviews)<\/li>\n<li>Customer support emails and responses<\/li>\n<li>Social media and other marketing collateral<\/li>\n<li>Email marketing campaigns<\/li>\n<li>API documentation<\/li>\n<li>You can go about content localization in several ways. Some brands classify their content according to the level of visibility, impact, durability, and sensitivity, and then follow a human-only, automated, or hybrid approach to translation.<\/li>\n<\/ul>\n<p>For example, creative copy is usually assigned to a qualified translator, whereas chatbot scripts and error messages are sometimes machine-translated and then edited by a human. The translation of highly perishable content like app store reviews is commonly raw automated machine-translation output.<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-16237\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-content-localization.png\" alt=\"UX localization in 4 key stages: content localization overview | Phrase\" width=\"1280\" height=\"706\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-content-localization.png 1280w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-content-localization-300x165.png 300w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-content-localization-1024x565.png 1024w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-content-localization-768x424.png 768w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/p>\n<h2><span class=\"ez-toc-section\" id=\"how-technology-can-influence-the-success-of-ux-localization\"><\/span>How technology can influence the success of UX localization<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Just like you have an array of systems and tools that help you with development, design, content, marketing, and customer support, UX localization can become significantly simpler as a result of the appropriate technology choices.<br \/>\nAn app localization platform, for example, allows localization professionals to use a web-based interface to manage all tasks within the localization workflow, such as:<\/p>\n<ul>\n<li>Creating teams, projects, and tasks<\/li>\n<li>Pulling strings from the source code of your app into the localization platform<\/li>\n<li>Assigning team members for <a href=\"https:\/\/phrase.com\/blog\/posts\/improve-workflow-correcting-translated-ui-strings\/\">translation and review of said strings<\/a><\/li>\n<li>Importing the translated strings back into your source code<\/li>\n<li>Putting it all together and compiling localized builds of your app or website<\/li>\n<li>Centralizing the efforts of developers, designers, marketing managers, and executives by letting them work collaboratively in the same workspace<\/li>\n<li>Generating automatic UI screenshots that serve as context for translators and reviewers<\/li>\n<li>Checking for linguistic consistency across projects<\/li>\n<li>Automating tasks and workflows to save time<\/li>\n<\/ul>\n<p>If you want to design your app\u2019s UX for global success, consider increasing automation, centralization, and collaboration with an app localization platform from the start. This will enable your team to identify, prevent, and resolve UX internationalization and localization issues as early as possible in your app development process.<br \/>\n<a href=\"https:\/\/phrase.com\/wp-content\/uploads\/2022\/02\/UX-localization-overview-phrase.pdf\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-16238 size-full\" src=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase.png\" alt=\"UX localization in 4 key stages | Phrase\" width=\"1280\" height=\"2224\" srcset=\"https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase.png 1280w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase-173x300.png 173w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase-589x1024.png 589w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase-768x1334.png 768w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase-884x1536.png 884w, https:\/\/phrase.com\/wp-content\/uploads\/2016\/12\/ux-localization-phrase-1179x2048.png 1179w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>UX localization is all about adaptation. Learn how to implement localization and internationalization into your global UX design.<\/p>\n","protected":false},"author":50,"featured_media":1238,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_stopmodifiedupdate":true,"_modified_date":"","_searchwp_excluded":"","footnotes":""},"categories":[38],"class_list":["post-15102","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-localization-strategy"],"acf":[],"_links":{"self":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/15102"}],"collection":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/users\/50"}],"replies":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/comments?post=15102"}],"version-history":[{"count":9,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/15102\/revisions"}],"predecessor-version":[{"id":86283,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/posts\/15102\/revisions\/86283"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/media\/1238"}],"wp:attachment":[{"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/media?parent=15102"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/phrase.com\/wp-json\/wp\/v2\/categories?post=15102"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}