Web, Mobile and Interface Development
event
noun
Meaning
Something that happens in the browser and that code can react to, such as a click, a key press, a form submission or the page finishing loading.
Where you use it
Developers listen for, handle, fire and prevent events. Common phrases are 'click event', 'event handler' and event.preventDefault(), which stops the browser's default action.
Examples
The click event fires twice because the listener was added twice.
Call preventDefault() on the submit event so the page doesn't reload.
Common phrases
click event · event handler · fire an event · handle an event · custom event
More about this term →database
noun
Meaning
An organized store of data, such as users, orders or posts, that a back end can save to, search and update quickly.
Where you use it
Web projects use relational databases such as PostgreSQL and MySQL, which are queried with SQL, or NoSQL databases such as MongoDB. Developers query, migrate, back up and seed a database.
Examples
The page is slow because it hits the database thirty times per request.
Please don't run tests against the production database.
Common phrases
query the database · database migration · relational database · database backup · production database
More about this term →cookie
noun
Meaning
A small piece of data that a website stores in the browser and that is sent back with later requests, used for logins, settings and tracking.
Where you use it
Servers set cookies with the Set-Cookie header; important attributes are HttpOnly, Secure and SameSite. Privacy rules in the EU and other regions are the reason many sites show a cookie banner asking for consent.
Examples
The session cookie is HttpOnly, so JavaScript can't read it.
Users stay logged in because we store a cookie for thirty days.
Common phrases
set a cookie · session cookie · third-party cookies · cookie banner · clear cookies
More about this term →load time
noun
Meaning
How long a page takes to download and appear on screen in a usable state, usually measured in seconds or milliseconds.
Where you use it
Teams measure, reduce and monitor page load time, often with Lighthouse or with data from real users. Because 'loaded' can mean many things, developers now prefer specific metrics such as Largest Contentful Paint.
Examples
After we compressed the images, load time dropped from four seconds to under two.
Mobile load time matters more because most of our visitors use phones.
Common phrases
page load time · reduce load time · fast load time · measure load time
More about this term →cache
noun
Meaning
A place where copies of files or data are kept for a while so they can be served again faster, for example in the browser, on a CDN or on the server.
Where you use it
Also a verb: to cache a response. Developers clear and invalidate caches and set Cache-Control headers. 'It's a cache issue' is a typical answer when users still see an old version.
Examples
Users still see the old logo because it's in their browser cache.
We cache the product list for five minutes to reduce database load.
Usage note
Pronounced exactly like 'cash', not 'catch' or 'cash-ay'.
Common phrases
clear the cache · browser cache · cache invalidation · cache headers · hard refresh
More about this term →SEO
abbreviation
Meaning
Search Engine Optimization: work that helps a site's pages to be found, understood and shown higher in search engines such as Google.
Where you use it
Said letter by letter. For developers, technical SEO means clean URLs, fast pages, correct HTML, meta tags, sitemaps and pages that crawlers can render. Marketing teams usually own content and keywords.
Examples
The new site looks great, but we lost traffic because nobody checked the SEO.
Server-side rendering helped our SEO, since search bots now get the full HTML.
Common phrases
technical SEO · SEO-friendly URLs · improve SEO · SEO audit
More about this term →alt text
noun
Meaning
A short written description of an image, added with the alt attribute, that screen readers read aloud and browsers show if the image fails to load.
Where you use it
Developers and editors write, add and check alt text. Purely decorative images get an empty alt (alt="") so screen readers skip them. Good alt text describes the purpose of the image, not just its appearance.
Examples
Every product photo needs alt text before we publish the page.
The alt text just says 'image1.jpg', which doesn't help anyone.
Usage note
'Alt' here is short for 'alternative'; it has nothing to do with the Turkish word 'alt' (bottom).
Common phrases
write alt text · add alt text · empty alt · descriptive alt text
More about this term →heading
noun
Meaning
A title for a page or section, marked up with the elements h1 to h6, where h1 is the main title and the others show lower levels.
Where you use it
Headings form the outline of a page for screen readers and search engines, so developers keep a logical heading order and avoid skipping levels just to get a smaller font size.
Examples
Each page should have one main heading in an h1.
The section headings jump from h2 to h5, so the outline is confusing.
Usage note
A heading (h1–h6) is title text. A header is something else: the <header> element at the top of a page or section, or an HTTP header.
Common phrases
main heading · heading level · section heading · heading structure
More about this term →link
noun
Meaning
Clickable text or an image that takes the user to another page or place, created in HTML with the a element and its href attribute.
Where you use it
Also a verb: 'link to the pricing page'. Developers talk about internal and external links, broken links and link text; the full word 'hyperlink' appears mostly in formal writing.
Examples
There are twelve broken links in the old blog posts.
Use a link for navigation and a button for actions.
Usage note
'Click here' is weak link text: screen-reader users and search engines get more from link text that says where the link goes.
Common phrases
broken link · internal link · link text · click a link · link to a page
More about this term →form
noun
Meaning
A part of a page where users enter information, such as a login, search or contact form, which is then sent to a server.
Where you use it
Developers build, validate and submit forms and handle form errors. Good forms have a label for every field, clear error messages and the right input types, such as email or tel.
Examples
The contact form sends the message, but the user never sees a confirmation.
We validate the form in the browser first and then again on the server.
Common phrases
submit a form · form validation · contact form · form field · login form
More about this term →input field
noun
Meaning
A box or control in a form where a user types or selects a value, such as a name, an email address, a password or a date.
Where you use it
Created mostly with the input element and its type attribute (text, email, password, checkbox, date). Developers often just say 'input' or 'field', and talk about placeholders, labels and required fields.
Examples
The phone input field should only accept numbers.
Every input field needs a visible label, not just placeholder text.
Common phrases
text input field · required field · input type · placeholder text · field label
More about this term →semantic HTML
noun
Meaning
HTML that uses elements according to their meaning, such as nav, main, article and button, instead of generic div and span elements for everything.
Where you use it
Comes up in code reviews and accessibility work: semantic HTML gives screen readers, search engines and browsers useful information for free. Its opposite is jokingly called 'div soup'.
Examples
Replace the clickable div with a real button; semantic HTML gives you keyboard support for free.
Good semantic HTML makes the page easier to style and easier to test.
Common phrases
semantic elements · semantic markup · landmark elements · div soup
More about this term →box model
noun
Meaning
The CSS idea that every element is a rectangular box made of content, padding, border and margin, which together decide its size and spacing.
Where you use it
Comes up when sizes look wrong. Many projects set box-sizing: border-box so that the width includes padding and border. Browser developer tools show the box model of the selected element.
Examples
The card is 20 pixels wider than expected; check the box model in DevTools.
Once you understand the box model, spacing in CSS makes much more sense.
Common phrases
CSS box model · box-sizing · border-box · content box
More about this term →margin
noun
Meaning
The space outside an element's border, which pushes other elements away from it.
Where you use it
Set with margin or with margin-top, margin-right and so on. 'margin: 0 auto' is a classic way to center a block. Vertical margins between blocks can collapse into one, which surprises many beginners.
Examples
Remove the bottom margin from the last paragraph.
There's too much margin between the title and the image.
Usage note
Margin is outside the border; padding is inside it. An easy way to remember: padding is like the padding inside a jacket.
Common phrases
add margin · margin collapse · negative margin · margin: 0 auto
More about this term →padding
noun
Meaning
The space inside an element, between its content and its border, which keeps the content away from the edges.
Where you use it
Set with padding or with padding-top, padding-left and so on. Padding shows the element's background color, while margin is always transparent. Buttons and cards almost always need some padding.
Examples
Give the button more padding so it's easier to tap on a phone.
The text touches the edge of the card because the padding is zero on mobile.
Common phrases
add padding · horizontal padding · padding-top · inner padding
More about this term →viewport
noun
Meaning
The visible area of a web page inside the browser window or phone screen, which changes size when the window is resized or the phone is rotated.
Where you use it
Responsive pages need the viewport meta tag (width=device-width, initial-scale=1). The CSS units vw and vh are percentages of the viewport's width and height, and 'above the fold' means inside the first viewport.
Examples
Without the viewport meta tag, the phone shows a tiny desktop version of the page.
The hero image should fill the whole viewport on desktop.
Common phrases
viewport meta tag · viewport width · small viewports · fill the viewport
More about this term →event listener
noun
Meaning
A function that waits for a specific event on an element, such as a click or a key press, and runs when that event happens.
Where you use it
Added with addEventListener() and removed with removeEventListener(). Forgotten listeners can cause memory leaks or code that runs twice. 'Event handler' is used for almost the same idea.
Examples
Add one event listener to the form instead of one to every input.
The modal closes twice because two event listeners are attached.
Common phrases
add an event listener · remove an event listener · attach a listener · scroll listener
More about this term →asynchronous
adjective
Meaning
Describes code that starts a task, such as loading data, and goes on running other code instead of waiting for that task to finish.
Where you use it
Often shortened to async, which is also a JavaScript keyword: async functions use await to pause until a promise settles. Network requests, timers and file reads are typical asynchronous operations.
Examples
The data is undefined because the request is asynchronous and hasn't finished yet.
Wrap the asynchronous call in try/catch so you can show an error message.
Usage note
The opposite is synchronous: code that runs line by line and waits for each step to finish.
Common phrases
asynchronous code · asynchronous request · async function · async/await
More about this term →promise
noun
Meaning
A JavaScript object that stands for a result that is not ready yet, such as data from a server, and that later succeeds or fails.
Where you use it
A promise is first pending, then fulfilled (resolved) or rejected. Developers handle it with .then() and .catch() or with async/await, and say that a function 'returns a promise'.
Examples
fetch() returns a promise, so you need await before you can read the data.
One of the promises was rejected, so Promise.all failed.
Common phrases
return a promise · resolve a promise · rejected promise · unhandled promise rejection
More about this term →state
noun
Meaning
The data an app or component holds at a given moment, such as whether a menu is open or what a user has typed, which controls what is shown.
Where you use it
Developers set, update, share and reset state, and 'lift state up' to a parent component. Global state is shared across the app, often with a state management library; local state belongs to one component. When state changes, the UI re-renders.
Examples
Keep the filter values in state so the list updates when they change.
The cart count is wrong because two components keep their own copy of the state.
Common phrases
update state · global state · local state · state management · lift state up
More about this term →single-page application
noun
Meaning
A web app that loads one HTML page and then updates the content with JavaScript as the user moves around, instead of loading a new page each time.
Where you use it
Usually shortened to SPA. SPAs feel fast after the first load but need extra work for SEO, the back button and initial load time, so many teams now combine them with server rendering.
Examples
Our admin panel is a single-page application built with Vue.
Since it's a single-page application, the browser never does a full reload.
Common phrases
build a single-page application · SPA framework · client-side routing · multi-page application
More about this term →session
noun
Meaning
The period during which a server remembers a logged-in user, usually through an ID stored in a cookie, until the user logs out or the session expires.
Where you use it
Developers create, store, expire and destroy sessions, and talk about session timeouts. The browser's sessionStorage API is a different thing: data kept only while the tab is open.
Examples
Your session has expired. Please log in again.
We store sessions in Redis so that all servers can share them.
Common phrases
session cookie · session timeout · session expired · end a session · session ID
More about this term →server-side
adjective
Meaning
Happening on the server rather than in the user's browser, for example server-side code, validation or rendering.
Where you use it
Written with a hyphen before a noun (server-side rendering) and as two words after a preposition (on the server side). Its opposite is client-side. Server-side rendering is often shortened to SSR.
Examples
Never trust client input; always do server-side validation as well.
We switched to server-side rendering to make the first load faster.
Common phrases
server-side rendering · server-side validation · server-side code · on the server side
More about this term →environment variable
noun
Meaning
A named setting, such as a database URL or an API key, that is given to an app from outside the code so that it can differ between environments.
Where you use it
Often kept in a .env file during development and set in the hosting dashboard for staging and production. Developers read, set and rotate them; .env files with secrets are normally kept out of Git.
Examples
The build fails because the API_URL environment variable is missing.
Put the payment key in an environment variable, not in the source code.
Common phrases
set an environment variable · .env file · missing environment variable · env vars
More about this term →CDN
abbreviation
Meaning
Content Delivery Network: a network of servers around the world that stores copies of a site's files and delivers them from the location closest to each user.
Where you use it
Cloudflare, Fastly, Akamai and Amazon CloudFront are well-known CDNs. Developers put images, scripts and even whole pages behind a CDN and purge the CDN cache after a release.
Examples
Images load slowly in Asia because we don't use a CDN yet.
Purge the CDN cache, or users will keep getting the old file.
Common phrases
serve from a CDN · CDN cache · purge the CDN · edge server
More about this term →cross-browser
adjective
Meaning
Working the same way in different browsers, such as Chrome, Firefox, Safari and Edge, and in their different versions and on different devices.
Where you use it
Mostly heard in 'cross-browser testing' and 'cross-browser compatibility'. Developers check browser support on the Can I use website and add fallbacks or polyfills for older browsers.
Examples
We need a day of cross-browser testing before the launch.
This cross-browser bug only appears in Safari on iOS.
Common phrases
cross-browser testing · cross-browser compatibility · cross-browser issues · browser support
More about this term →specificity
noun
Meaning
The rule CSS uses to decide which style wins when several rules target the same element: ID selectors beat class selectors, which beat element selectors.
Where you use it
Comes up whenever 'my CSS isn't working'. Developers talk about high or low specificity, 'specificity wars' and overriding with !important, which is usually seen as a last resort. Inline styles beat rules in stylesheets.
Examples
Your rule doesn't apply because the theme's selector has higher specificity.
Keep specificity low so components are easy to override.
Usage note
A hard word to say: spe-si-FI-si-ty, with the stress on the third syllable.
Common phrases
high specificity · specificity war · increase specificity · override with !important
More about this term →npm
noun
Meaning
The standard package manager for JavaScript and the online registry it installs packages from, used through commands such as npm install.
Where you use it
Said letter by letter and written in lowercase. Developers install, update and publish packages with npm and run project scripts with npm run. Alternatives such as pnpm and Yarn use the same registry.
Examples
Run npm install after you pull, because the dependencies have changed.
This package has two million weekly downloads on npm.
Usage note
It is often expanded as 'Node Package Manager', but the project itself says that npm is not officially an acronym.
Common phrases
npm install · npm package · npm run build · publish to npm
More about this term →TypeScript
noun
Meaning
A programming language built on JavaScript that adds types, so that many errors are found while you write the code instead of when it runs.
Where you use it
Created by Microsoft and widely used with React, Angular, Vue and Node.js. TypeScript is compiled to plain JavaScript; developers talk about types, interfaces, type errors and strict mode.
Examples
TypeScript caught the bug: we were passing a string where a number was expected.
We're slowly moving the old JavaScript files to TypeScript.
Common phrases
written in TypeScript · TypeScript types · type error · migrate to TypeScript
More about this term →bundler
noun
Meaning
A tool that combines many JavaScript, CSS and other files and their dependencies into a few optimized files that browsers can load quickly.
Where you use it
Well-known bundlers and build tools include webpack, Rollup, esbuild and Vite. The output is called a bundle; developers talk about bundle size, code splitting and tree shaking (removing unused code).
Examples
The bundler puts the whole chart library into the main file, which is why it's so large.
We replaced our old bundler with Vite, and the dev server now starts in a second.
Common phrases
bundle size · JavaScript bundler · code splitting · tree shaking
More about this term →lazy loading
noun
Meaning
A technique that waits to load images, videos or code until they are actually needed, for example when the user scrolls near them.
Where you use it
For images and iframes it can be as simple as loading="lazy". In JavaScript apps, routes and components are lazy-loaded with dynamic import(). Images at the top of the page are usually not lazy-loaded, because that would delay the main content.
Examples
Lazy loading the product images cut the initial page weight in half.
The admin pages use lazy loading, so normal users never download that code.
Common phrases
lazy-load images · native lazy loading · lazy-loaded route · dynamic import
More about this term →minify
verb
Meaning
To make code files smaller by removing spaces, comments and line breaks and by shortening names, without changing how the code works.
Where you use it
Build tools minify JavaScript, CSS and HTML automatically for production. Minified files often end in .min.js, and source maps let developers debug minified code.
Examples
Is the CSS minified in production? The file is 300 KB.
The error is hard to read because the code is minified; turn on source maps.
Usage note
Minifying is not the same as compressing: compression (gzip or Brotli) is done by the server when it sends the files, and the two are usually used together.
Common phrases
minify JavaScript · minified file · minification · source map
More about this term →image optimization
noun
Meaning
Making image files as small as possible while they still look good, for example by compressing and resizing them and by using modern formats.
Where you use it
Covers modern formats such as WebP and AVIF, responsive images with srcset, correct dimensions and lazy loading. Many frameworks and CDNs offer automatic image optimization.
Examples
Image optimization alone made the home page twice as fast.
Editors upload 5 MB photos, so we need image optimization in the upload step.
Usage note
British English often writes optimisation, but code, tools and most documentation use the American spelling, optimization.
Common phrases
automatic image optimization · compress images · responsive images · modern image formats
More about this term →Core Web Vitals
noun
Meaning
Three metrics from Google that measure real user experience on a page: loading (LCP), responsiveness (INP) and visual stability (CLS).
Where you use it
LCP is Largest Contentful Paint, INP is Interaction to Next Paint (it replaced FID in 2024) and CLS is Cumulative Layout Shift. Teams track them in Search Console and PageSpeed Insights; they are one of many signals Google uses in ranking.
Examples
Our Core Web Vitals failed on mobile because of a large layout shift in the header.
After the redesign, all three Core Web Vitals are in the green.
Common phrases
pass Core Web Vitals · Core Web Vitals report · layout shift · field data
More about this term →ARIA
abbreviation
Meaning
Accessible Rich Internet Applications: a set of HTML attributes, such as role and aria-label, that give assistive technology extra information about elements.
Where you use it
Pronounced like the music word 'aria'. ARIA is used for custom widgets such as tabs, menus and dialogs. A well-known principle says a native HTML element is better than a div with ARIA added to it.
Examples
The icon button needs an aria-label so that screen readers can announce it.
Too much ARIA can make a page harder to use, not easier.
Common phrases
ARIA attributes · aria-label · ARIA role · aria-hidden · ARIA live region
More about this term →keyboard navigation
noun
Meaning
Using a site with the keyboard only, moving between links, buttons and fields with Tab and activating them with Enter or Space.
Where you use it
Developers test keyboard navigation by putting the mouse aside. Key ideas are a visible focus indicator, a logical tab order, no keyboard traps and 'skip to content' links.
Examples
Keyboard navigation breaks in the modal: Tab moves focus to the page behind it.
Someone removed the focus outline, so keyboard navigation is almost impossible now.
Common phrases
keyboard accessible · tab order · focus indicator · keyboard trap · skip link
More about this term →contrast ratio
noun
Meaning
A number that compares the brightness of text with the brightness of its background; high ratios such as 7:1 are easier to read than low ones such as 2:1.
Where you use it
WCAG level AA asks for at least 4.5:1 for normal text and 3:1 for large text. Designers and developers check colors with contrast checkers or in the browser's developer tools.
Examples
The light grey text on white has a contrast ratio of only 2.8:1.
We darkened the brand blue to reach a 4.5:1 contrast ratio.
Common phrases
color contrast · meet the contrast ratio · low contrast · contrast checker
More about this term →meta tag
noun
Meaning
An HTML tag in the head of a page that gives browsers and search engines information about the page, such as its description or viewport settings.
Where you use it
Common ones are the meta description, the viewport tag, the robots tag and Open Graph tags (og:title, og:image) for link previews on social media. The title tag is often discussed with them but is a separate element.
Examples
Every product page needs its own description meta tag.
The link preview shows no image because the og:image meta tag is missing.
Usage note
Google does not use the old 'keywords' meta tag for ranking.
Common phrases
meta description · robots meta tag · Open Graph tags · add a meta tag
More about this term →sitemap
noun
Meaning
A file, usually sitemap.xml, that lists the pages of a website so that search engines can find and crawl them more easily.
Where you use it
Developers generate sitemaps automatically, list them in robots.txt and submit them in tools such as Google Search Console. Large sites split them into several files with a sitemap index.
Examples
The new blog posts aren't in the sitemap, so Google takes longer to find them.
Regenerate the sitemap every time we publish a product.
Common phrases
XML sitemap · submit a sitemap · sitemap index · generate a sitemap
More about this term →crawl
verb
Meaning
For a search engine bot to visit pages automatically, follow their links and download their content so that they can be indexed.
Where you use it
The bot is called a crawler or spider; Google's is Googlebot. Developers control crawling with robots.txt and talk about crawl errors and, on very large sites, the 'crawl budget'.
Examples
Googlebot crawled the staging site because nobody had blocked it.
Pages that can only be reached through a search form are hard for bots to crawl.
Usage note
In Turkish, 'tarayıcı' can mean both browser and crawler. In English they are different words: a browser is a program for people, a crawler is a bot.
Common phrases
crawl a site · search engine crawler · crawl budget · crawl errors · block crawlers
More about this term →mobile app
noun
Meaning
A program designed to run on a smartphone or tablet, usually downloaded from an app store such as the App Store or Google Play.
Where you use it
The everyday word in job ads, meetings and product plans. In speech people simply say 'the app'; 'application' sounds more formal and is more common in documentation and official names.
Examples
Most of our customers now order through the mobile app, not the website.
We need a mobile app for both iOS and Android by the end of the year.
Usage note
'Application' also means a job application; in software it means a program. Turkish 'aplikasyon' is not used for software: say 'uygulama'.
Common phrases
build a mobile app · mobile app developer · launch a mobile app · mobile app users
More about this term →iOS
noun
Meaning
Apple's operating system for the iPhone. Apps for it are built with Apple's own tools, mainly Xcode and the Swift programming language.
Where you use it
Used as a noun and before other nouns: iOS app, iOS developer, iOS version. Developers often talk about the minimum iOS version an app supports. Since 2019 the iPad's system has its own name, iPadOS, but it shares most of the same SDK.
Examples
The bug only happens on iOS 17; Android users are not affected.
We're dropping support for iOS 15 in the next release.
Usage note
Always written with a small 'i' and capital 'OS', and read letter by letter: 'eye-oh-ess'.
Common phrases
iOS app · iOS developer · minimum iOS version · support older iOS versions
More about this term →Android
noun
Meaning
Google's mobile operating system, used by many phone makers such as Samsung, Xiaomi and Google itself. Its apps are mainly written in Kotlin or Java.
Where you use it
Used like iOS: Android app, Android developer, Android version. Developers also talk about API levels (each Android version has a number, such as API 34 for Android 14) and about testing on many different devices from different manufacturers.
Examples
The layout looks fine on Pixel phones but breaks on some older Android devices.
In Turkey, our Android app has twice as many users as the iOS one.
Common phrases
Android app · Android device · Android version · API level
More about this term →native app
noun
Meaning
An app built for one specific platform with that platform's own languages and tools, such as Swift for iOS or Kotlin for Android.
Where you use it
Usually compared with cross-platform and hybrid apps. Teams discuss whether to 'go native' for better performance and full access to device features, or to share code across platforms. 'Native' is also used alone: native code, native module, native look and feel.
Examples
The banking team chose a separate native app for each platform because of the security requirements.
A native app can use new iOS features on the day they are released.
Usage note
'Native' here has nothing to do with 'native speaker'; it means 'made with the platform's own tools'.
Common phrases
build a native app · go native · native code · native performance
More about this term →cross-platform
adjective
Meaning
Describes an app or framework that runs on more than one platform, usually both iOS and Android, from one shared codebase.
Where you use it
Used before nouns (cross-platform app, cross-platform framework, cross-platform development) and in discussions about cost, speed and performance. React Native and Flutter are the best-known cross-platform frameworks; Kotlin Multiplatform focuses on sharing business logic.
Examples
A cross-platform app let us ship to both stores with a team of three.
Is cross-platform development fast enough for a video editing app?
Common phrases
cross-platform app · cross-platform framework · cross-platform development · go cross-platform
More about this term →emulator
noun
Meaning
A program that copies the hardware and software of a mobile device on a computer, so you can run and test an app without a real phone.
Where you use it
The word Android developers use: the Android Emulator comes with Android Studio, and you create virtual devices (AVDs) with different screen sizes and Android versions. Typical phrases: run on the emulator, launch the emulator, test on an emulator.
Examples
It works on the emulator, but it crashes on my Samsung.
Create an emulator with API 26 so we can check the oldest supported version.
Usage note
iOS developers say simulator, Android developers say emulator; in conversation many people use the two words interchangeably.
Common phrases
Android Emulator · run on the emulator · launch the emulator · test on an emulator
More about this term →simulator
noun
Meaning
Apple's tool, included with Xcode, that runs iOS apps on a Mac in a window that looks like an iPhone or iPad, without imitating the real device hardware.
Where you use it
iOS developers say 'run it on the simulator' or 'in the Simulator'. Because it uses the Mac's own processor, some things behave differently from a real device, such as performance, the camera and some sensors, so final testing is done on real iPhones.
Examples
The animation is smooth on the simulator but laggy on an iPhone 11.
Can you check the new layout on the iPad simulator too?
Common phrases
iOS Simulator · run on the simulator · reset the simulator · simulator build
More about this term →screen
noun
Meaning
One full view of an app that the user sees at a time, such as the login screen or the settings screen; apps are planned as a set of screens.
Where you use it
Used constantly in design reviews, tickets and test steps: home screen, detail screen, 'go back to the previous screen'. In UIKit code a screen is often a view controller, on Android an activity or fragment, and in SwiftUI or Compose a view or composable.
Examples
After a successful payment, the user should land on the order summary screen.
This screen has too many buttons; let's move some of them to a menu.
Common phrases
home screen · login screen · screen size · navigate to a screen · previous screen
More about this term →tap
verb
Meaning
To touch the screen quickly with one finger to select something, for example a button, a link or an item in a list.
Where you use it
The standard verb in mobile test steps, bug reports and UI text: tap the button, tap on the icon, double-tap to zoom. Also a noun: one tap, with a single tap. Related gestures are long press (press and hold), swipe and pinch.
Examples
Tap the Save button twice quickly and the order is created twice.
Users can share a photo with a single tap.
Usage note
In English you click with a mouse; on a touchscreen, write 'tap'. Turkish speakers often say 'click' for both.
Common phrases
tap a button · tap on the icon · double-tap · with a single tap · tap target
More about this term →scroll
verb
Meaning
To move the content of a screen up, down or sideways to see more of it, usually by sliding a finger across a list or page.
Where you use it
Common in bug reports and performance talk: scroll down, scroll to the top, smooth scrolling, the list 'jumps' while scrolling. Also a noun in 'scroll position' and 'infinite scroll', where new items load as the user reaches the end.
Examples
When you scroll fast through the product list, some images load in the wrong place.
The app should keep the scroll position when the user comes back.
Common phrases
scroll down · scroll to the top · smooth scrolling · scroll position · infinite scroll
More about this term →app lifecycle
noun
Meaning
The series of states an app moves through from launch to being closed, such as active, in the background or suspended, and the events the system sends at each change.
Where you use it
Developers handle the lifecycle to save data, pause videos or stop location updates at the right moment. On Android it is described through methods like onCreate, onResume and onPause; on iOS through app and scene states such as active, inactive and background.
Examples
The timer stops because we don't handle the app lifecycle correctly when the phone is locked.
Every new Android developer should understand the activity and app lifecycle first.
Common phrases
app lifecycle · lifecycle method · lifecycle event · handle the lifecycle
More about this term →background
noun
Meaning
The state of an app that is still running or kept in memory but is not visible on the screen, for example after the user switches to another app.
Where you use it
Used in phrases like 'in the background', 'go to the background', 'background task' and 'background refresh'. Both iOS and Android strictly limit what an app can do in the background to save battery, so long-running work needs special APIs.
Examples
The upload stops as soon as the app goes to the background.
We refresh the news feed in the background so it's ready when users open the app.
Common phrases
in the background · go to the background · background task · background refresh · background mode
More about this term →foreground
noun
Meaning
The state of an app that is open and visible on the screen, so the user can interact with it directly.
Where you use it
Common phrases: in the foreground, come to the foreground, return to the foreground. Apps often refresh data when they return to the foreground. On Android, a 'foreground service' keeps running with a visible notification, for example for music playback or navigation.
Examples
We show the in-app message only when the app is in the foreground.
When the app comes back to the foreground, refresh the user's balance.
Common phrases
in the foreground · come to the foreground · return to the foreground · foreground service
More about this term →offline mode
noun
Meaning
A way of working in which an app stays usable without an internet connection, showing saved data and sending changes later when the connection returns.
Where you use it
Common in requirements and planning: support offline mode, work offline, offline-first. An offline-first app saves data on the device first and syncs with the server later. Testers often check it by turning on airplane mode.
Examples
Field workers need offline mode because there is no signal on most building sites.
In offline mode, the app shows the last saved prices with a small warning.
Common phrases
support offline mode · work offline · offline-first · go offline
More about this term →local storage
noun
Meaning
Space on the device itself where an app saves data, such as settings, files or a database, so it is available without contacting a server.
Where you use it
A general term for options such as UserDefaults on iOS, SharedPreferences or DataStore on Android, plain files and databases like SQLite. Teams decide what to keep in local storage and what must stay on the server. Sensitive data such as tokens is usually kept in secure storage like the keychain.
Examples
We keep the user's draft in local storage so nothing is lost if the app crashes.
Clearing local storage logs the user out and resets all settings.
Usage note
In web development, localStorage (one word) is a specific browser API; in mobile development 'local storage' is just a general description.
Common phrases
save to local storage · read from local storage · clear local storage · store data locally
More about this term →in-app purchase
noun
Meaning
Something a user buys inside an app, such as extra features, game coins or a subscription, paid through the App Store or Google Play.
Where you use it
Often shortened to IAP. Types include consumables (used up, like coins), non-consumables (bought once, like removing ads) and subscriptions. Developers use StoreKit on iOS and the Google Play Billing Library on Android. The stores take a commission, and rules on outside payment options differ by country.
Examples
Most of our revenue comes from in-app purchases, not from ads.
Restoring an in-app purchase on a new phone doesn't work on Android.
Common phrases
make an in-app purchase · offer in-app purchases · restore purchases · consumable in-app purchase
More about this term →Xcode
noun
Meaning
Apple's development environment for writing, building, testing and publishing apps for iPhone, iPad, Mac and other Apple platforms. It runs only on macOS.
Where you use it
iOS developers open a project in Xcode, run it on a simulator, archive a build and upload it to App Store Connect from there. A new Xcode version arrives with each major iOS version, and teams often have to update Xcode to use the latest SDK.
Examples
After updating Xcode, the project doesn't compile anymore.
Archive the app in Xcode and upload it to TestFlight.
Usage note
Pronounced 'ex-code'. It cannot be installed on Windows or Linux, so iOS development normally needs a Mac.
Common phrases
open in Xcode · update Xcode · Xcode project · Xcode version · archive in Xcode
More about this term →Android Studio
noun
Meaning
Google's official development environment for Android apps, based on IntelliJ IDEA, with a code editor, the Android Emulator, profilers and build tools.
Where you use it
Android developers open, build and run projects in Android Studio, manage virtual devices, read Logcat and work with the Gradle build system. Unlike Xcode, it runs on Windows, macOS and Linux.
Examples
Open the project in Android Studio and sync Gradle first.
Android Studio's profiler shows memory going up every time we open the gallery.
Common phrases
open in Android Studio · Android Studio profiler · update Android Studio · Android Studio project
More about this term →Swift
noun
Meaning
The programming language Apple introduced in 2014 for building apps on iOS and its other platforms; it has largely replaced the older Objective-C.
Where you use it
Job ads ask for Swift experience, often together with SwiftUI and UIKit. Developers talk about Swift versions, Swift packages (Swift Package Manager) and newer language features such as async/await and Swift concurrency.
Examples
We're rewriting the old Objective-C screens in Swift.
Candidates should have at least two years of Swift experience.
Common phrases
written in Swift · Swift developer · Swift package · Swift concurrency
More about this term →Kotlin
noun
Meaning
A modern programming language created by JetBrains that Google recommends as the main language for Android development; it works alongside Java code.
Where you use it
Since 2019 Android development has been 'Kotlin-first', so most new Android code, libraries and documentation use Kotlin. Developers talk about coroutines for asynchronous work, Kotlin Multiplatform for sharing code with iOS, and migrating from Java to Kotlin.
Examples
All new Android features are written in Kotlin, but some old classes are still in Java.
We use Kotlin coroutines for all network calls.
Common phrases
written in Kotlin · Kotlin coroutines · Kotlin Multiplatform · migrate to Kotlin
More about this term →React Native
noun
Meaning
A cross-platform framework created by Meta that lets developers build iOS and Android apps with JavaScript or TypeScript and React, using real native UI components.
Where you use it
Popular with teams that already know React for the web. Developers mention Expo, a toolset that makes React Native projects easier to set up and build, and native modules, which they write when they need platform features that React Native does not provide.
Examples
Our web team already knows React, so React Native was the obvious choice.
This animation is smooth in Swift but drops frames in React Native.
Common phrases
React Native app · React Native developer · built with React Native · React Native project
More about this term →Flutter
noun
Meaning
Google's open-source framework for building mobile, web and desktop apps from one codebase; it uses the Dart language and draws its own UI on the screen.
Where you use it
Developers talk about widgets (everything in Flutter is a widget), hot reload, packages from pub.dev and state management options such as Provider, Riverpod or Bloc. Because Flutter draws its own UI, an app looks the same on every platform unless developers adapt it.
Examples
We built the first version in Flutter and launched on both stores in three months.
Is there a Flutter package for reading NFC cards?
Common phrases
Flutter app · Flutter widget · Flutter package · Flutter developer
More about this term →navigation bar
noun
Meaning
On iOS, the bar at the top of a screen that shows the title, a back button and action buttons; on Android, the name also refers to the system bar with the back and home controls.
Where you use it
iOS developers customize the navigation bar's title, color and buttons (bar button items). On Android, people talk about the system navigation bar or gesture navigation at the bottom of the screen. Often shortened to 'nav bar'.
Examples
Put the share button on the right side of the navigation bar.
On some Android phones, the navigation bar covers the button at the bottom.
Usage note
Material Design 3 also uses 'navigation bar' for the bottom bar with the app's main sections, which iOS calls a tab bar. Check which one people mean.
Common phrases
navigation bar title · nav bar · hide the navigation bar · back button in the navigation bar
More about this term →tab bar
noun
Meaning
A bar, usually at the bottom of the screen, with icons that let users switch between the main sections of an app, such as Home, Search and Profile.
Where you use it
The iOS name for this pattern; Android designers say bottom navigation or, in Material 3, navigation bar. Teams discuss which tabs to show, the selected tab, badges on tab icons, and whether to hide the tab bar on detail screens.
Examples
We added a fifth item to the tab bar for the new rewards section.
Tapping the selected tab in the tab bar should scroll the list back to the top.
Common phrases
tab bar item · hide the tab bar · bottom tab bar · selected tab
More about this term →swipe
verb
Meaning
To move a finger quickly across the screen in one direction, for example to see the next photo, delete an item in a list or go back.
Where you use it
Common in UI specs and test steps: swipe left, swipe right, swipe up, swipe to delete, swipe back. Also a noun (a swipe gesture). A swipe is short and fast; scroll describes moving through content, and drag means moving something while keeping the finger down.
Examples
Swipe left on a message to archive it.
Users swipe back by mistake while drawing their signature.
Common phrases
swipe left · swipe to delete · swipe back · swipe gesture · swipe up
More about this term →splash screen
noun
Meaning
The first screen people see while an app starts, usually showing the logo on a plain background until the main content is ready.
Where you use it
Apple calls it the launch screen and wants it to look like the app's first screen rather than an advert. Android 12 introduced the SplashScreen API, which gives every app a standard splash with its icon. Teams keep it short, because users feel a long splash as slowness.
Examples
The splash screen stays on for five seconds on older phones; that's far too long.
Marketing wants an animated logo on the splash screen.
Common phrases
splash screen animation · show a splash screen · launch screen · splash screen duration
More about this term →onboarding
noun
Meaning
The first screens a new user goes through after installing an app, which explain the main features, ask for permissions or help set up an account.
Where you use it
Product and design teams talk about the onboarding flow, onboarding screens and how many users complete or skip onboarding. They measure where users drop off and often try to make it shorter. In HR the same word means introducing new employees to a company.
Examples
Almost 40% of new users quit during onboarding, so we cut it from five screens to two.
Let's ask for notification permission at the end of onboarding, not on the first screen.
Common phrases
onboarding flow · onboarding screens · skip onboarding · complete onboarding
More about this term →dark mode
noun
Meaning
A display setting that shows light text on a dark background across the system and in apps that support it, often chosen for use at night.
Where you use it
Both iOS and Android have offered a system-wide dark mode since 2019. Developers support dark mode by using semantic colors that change automatically, and testers check every screen in both light and dark mode. Android documentation often says 'dark theme'.
Examples
In dark mode, the logo almost disappears against the background.
Does the new design support dark mode?
Common phrases
support dark mode · switch to dark mode · light and dark mode · dark mode colors
More about this term →sync
verb
Meaning
To make the data on the device and on the server the same by sending local changes and downloading new ones; short for synchronize.
Where you use it
Also a noun: background sync, a sync conflict, the last sync time. Offline-first apps must decide what happens when the same item was changed on two devices, which is called conflict resolution.
Examples
Notes created offline sync automatically when the phone is back online.
Show the last sync time at the bottom of the screen.
Usage note
Pronounced like 'sink'. The spelling 'synch' also exists but is rare.
Common phrases
sync data · background sync · sync conflict · last sync time · sync with the server
More about this term →hybrid app
noun
Meaning
An app built with web technologies such as HTML, CSS and JavaScript and wrapped in a native shell, so it can be installed from the stores and use some device features.
Where you use it
Built with tools such as Ionic, Capacitor or the older Apache Cordova; the content runs inside a web view. Often compared with native and cross-platform apps: hybrid apps reuse web code but may feel less smooth than native ones.
Examples
Our first version was a hybrid app built with Cordova, and scrolling was never smooth.
A hybrid app was enough for the internal expense tool.
Common phrases
hybrid app · hybrid framework · hybrid approach · hybrid vs native
More about this term →web view
noun
Meaning
A component that shows web pages inside an app without opening a separate browser, so developers can display web content within a native screen.
Where you use it
On iOS the class is WKWebView, and on Android it is WebView. Teams use web views for help pages, payment forms or entire hybrid apps. Developers talk about loading a URL in a web view, passing messages between JavaScript and native code, and web view performance.
Examples
The FAQ is just a web view that loads our help center.
The 3D Secure page opens in a web view, and the bank redirects the user back to the app.
Common phrases
load a URL in a web view · embedded web view · WKWebView · web view content
More about this term →hot reload
noun
Meaning
A development feature that shows code changes in the running app within a second or two, usually without losing the current screen or its state.
Where you use it
Best known from Flutter, where it is contrasted with hot restart, which resets the app's state. React Native's version is called Fast Refresh, while SwiftUI and Jetpack Compose offer live previews. Developers say a change 'didn't hot reload' when it needs a full rebuild.
Examples
With hot reload, the designer can see color changes on the phone almost immediately.
Hot reload doesn't pick up changes in the main function, so do a hot restart.
Common phrases
hot reload · hot restart · Fast Refresh · trigger a hot reload
More about this term →main thread
noun
Meaning
The thread on which an app draws its interface and handles user input; if slow work runs there, the app freezes and stops responding.
Where you use it
On Android also called the UI thread. Developers move network calls, database work and image processing off the main thread, while UI updates must happen on it. Android throws NetworkOnMainThreadException for network calls there, and blocking it too long causes an ANR.
Examples
The list freezes because we decode large images on the main thread.
UI updates must run on the main thread, otherwise the app may crash.
Common phrases
on the main thread · off the main thread · block the main thread · main thread checker
More about this term →cold start
noun
Meaning
Launching an app when it is not already in memory, so the system has to create everything from the beginning; it is the slowest kind of app launch.
Where you use it
Compared with warm and hot starts, when the app or parts of it are still in memory. Teams measure cold start time, try to reduce the work done at launch and track it in Google Play vitals and Xcode Organizer.
Examples
Cold start takes four seconds because we load every SDK at launch.
After the fix, cold start time dropped below one second on mid-range phones.
Common phrases
cold start time · warm start · reduce cold start · app launch time
More about this term →activity
noun
Meaning
In Android, a core app component that represents one screen with a user interface and has its own lifecycle, from being created to being destroyed.
Where you use it
Developers talk about the main activity, starting an activity with an intent, lifecycle methods (onCreate, onStart, onResume, onPause, onStop, onDestroy) and the activity being recreated after rotation. Modern apps often use a single activity with many fragments or Compose screens.
Examples
The activity is recreated when the user rotates the phone, so the form data disappears.
We moved to a single-activity architecture last year.
Usage note
In everyday English 'activity' is just something you do; in Android code it is the name of a specific class.
Common phrases
main activity · start an activity · activity lifecycle · single-activity architecture
More about this term →view controller
noun
Meaning
In iOS UIKit, an object that manages one screen or part of a screen: it loads the views, responds to user actions and handles events such as the screen appearing.
Where you use it
Developers push or present a view controller and override methods such as viewDidLoad and viewWillAppear. 'Massive view controller' is a well-known problem where too much code ends up in one class. In SwiftUI, views take over much of this role.
Examples
The profile view controller has grown to 2,000 lines; we need to split it.
Present the login view controller modally if the session has expired.
Common phrases
push a view controller · present a view controller · root view controller · massive view controller
More about this term →SwiftUI
noun
Meaning
Apple's declarative framework, introduced in 2019, for building user interfaces in Swift by describing what the screen should show for each state.
Where you use it
Often compared with UIKit, the older imperative framework, and many apps mix the two. Developers talk about views, modifiers, @State and Xcode previews. Job ads usually list 'SwiftUI and UIKit' together.
Examples
New screens are written in SwiftUI, but the old ones still use UIKit.
The SwiftUI preview lets the designer check every state without running the app.
Common phrases
SwiftUI view · SwiftUI and UIKit · SwiftUI preview · migrate to SwiftUI
More about this term →Jetpack Compose
noun
Meaning
Google's modern declarative toolkit for building Android user interfaces in Kotlin, using composable functions instead of XML layouts.
Where you use it
Usually just called Compose. It became stable in 2021 and is now Google's recommended way to build Android UI. Developers talk about composables, recomposition, state hoisting and Material 3 components.
Examples
We migrated the settings screen from XML to Jetpack Compose.
In Jetpack Compose, unnecessary recompositions can make a list stutter.
Common phrases
composable function · recomposition · Compose UI · migrate to Compose
More about this term →widget
noun
Meaning
A small view from an app that shows live information on the home screen or lock screen, such as the weather or the next meeting, without opening the app.
Where you use it
On iOS, widgets are built with WidgetKit; on Android they are app widgets, now often built with Jetpack Glance. Users add a widget to the home screen and choose its size. In Flutter the word means any UI building block, so context matters.
Examples
Users can now add a widget that shows their daily step count.
The widget shows yesterday's balance because it doesn't refresh often enough.
Usage note
In Flutter, 'widget' means every piece of the UI, from a button to a whole screen, not a home screen widget.
Common phrases
home screen widget · add a widget · lock screen widget · widget refresh
More about this term →bottom sheet
noun
Meaning
A panel that slides up from the bottom of the screen to show extra options or content, while part of the screen behind it often stays visible.
Where you use it
A Material Design term; on iOS the same pattern is called a sheet, which can stop at different heights called detents. Users drag a bottom sheet up or swipe it down to dismiss it. It can be modal, blocking the screen behind, or persistent.
Examples
Show the filter options in a bottom sheet instead of a new screen.
The bottom sheet covers the map's zoom buttons.
Common phrases
modal bottom sheet · dismiss the bottom sheet · expand the bottom sheet · bottom sheet handle
More about this term →modal
noun
Meaning
A screen or window shown on top of the current one that users must deal with, by finishing a task or closing it, before they can return to what they were doing.
Where you use it
Used as a noun (open a modal) and an adjective (a modal screen, present modally). On iOS, a view controller can be presented modally as a full-screen cover or a sheet. Designers use modals for focused tasks such as writing a message or confirming a payment.
Examples
Closing the modal should keep what the user has typed so far.
Present the payment confirmation as a modal, not as a pushed screen.
Common phrases
open a modal · close the modal · present modally · full-screen modal
More about this term →pull to refresh
phrase
Meaning
A gesture in which the user drags the top of a list downward and releases it to load the newest content, while a small spinner shows that it is loading.
Where you use it
Common in feeds, inboxes and order lists. Written with hyphens before a noun (a pull-to-refresh gesture). On iOS it is built with UIRefreshControl or SwiftUI's refreshable, and on Android with SwipeRefreshLayout or Compose's pull-to-refresh components.
Examples
Pull to refresh on the orders screen doesn't show the new order until you restart the app.
Users expect pull-to-refresh on every list.
Common phrases
pull-to-refresh gesture · refresh indicator · add pull to refresh · refresh the list
More about this term →safe area
noun
Meaning
The part of the screen that is not covered by the notch, camera cutout, status bar or home indicator, where important content and buttons can be placed safely.
Where you use it
An Apple term (safe area insets, safe area layout guide); Android developers talk about window insets and display cutouts instead. Bugs where a button sits under the home indicator are often described as 'not respecting the safe area'.
Examples
The Pay button is under the home indicator; the layout ignores the safe area.
The background image can go edge to edge, but the text must stay inside the safe area.
Common phrases
safe area insets · respect the safe area · ignore the safe area · window insets
More about this term →orientation
noun
Meaning
The way a device is held and the screen is shown: portrait (upright) or landscape (sideways); an app can support one or both.
Where you use it
Teams decide whether to lock the orientation or support rotation. On Android, an orientation change is a configuration change that recreates the activity by default, which can lose state if not handled. Tablets and foldable phones make orientation support more important.
Examples
The app is locked to portrait orientation, except for the video player.
The form resets after an orientation change on Android.
Common phrases
portrait orientation · landscape orientation · lock the orientation · orientation change · screen rotation
More about this term →screen density
noun
Meaning
How many pixels a screen has in a given physical area, measured in dots per inch (dpi); high-density screens need larger image files to look sharp.
Where you use it
To keep sizes consistent, Android uses density-independent pixels (dp) and density buckets such as hdpi, xhdpi and xxhdpi, while iOS uses points and @2x and @3x image assets. Designers hand off sizes in dp or pt, not in raw pixels.
Examples
The icons look blurry because we only exported them for one screen density.
Let's use vector images so we don't need a separate file for every screen density.
Common phrases
screen density · density-independent pixels · high-density screen · @2x and @3x assets
More about this term →SQLite
noun
Meaning
A small, fast database engine stored in a single file, built into both iOS and Android and widely used to save structured data on the device.
Where you use it
Developers rarely use it directly: on Android, the Room library sits on top of SQLite, and on iOS, Core Data and SwiftData often use it as their store. Teams talk about database migrations when the data structure changes between app versions.
Examples
We store the product catalog in SQLite so search works offline.
The update crashed for some users because the SQLite migration failed.
Common phrases
SQLite database · SQLite migration · Room database · Core Data store
More about this term →network request
noun
Meaning
A message an app sends over the internet to a server, for example to load a list or save a form, together with the response it waits for.
Where you use it
Developers make, cancel and retry network requests, set timeouts and show loading states. On iOS they usually use URLSession, on Android libraries such as Retrofit and OkHttp. iOS blocks plain HTTP by default through App Transport Security, so requests normally use HTTPS.
Examples
The home screen makes twelve network requests at launch; let's combine some of them.
Retry the network request when the connection comes back.
Common phrases
make a network request · cancel a network request · retry the request · request timeout
More about this term →persist
verb
Meaning
To save data so that it stays on the device after the app is closed or the phone restarts, for example in a database, a file or the settings.
Where you use it
A technical word in code reviews and design discussions: persist the cart, persisted state, data persistence, a persistence layer. Common tools include Core Data, SwiftData, Room, DataStore and UserDefaults. In everyday English it means to continue, as in 'the problem persists'.
Examples
We persist the shopping cart, so it's still there after the app restarts.
Should we persist the filter settings or reset them every time?
Common phrases
persist data · persisted state · data persistence · persistence layer
More about this term →receipt validation
noun
Meaning
Checking with Apple or Google that a purchase made in the app is real and still valid before giving the user the paid content or features.
Where you use it
Usually done on the server to prevent fraud. With StoreKit 2, Apple provides signed transactions and the App Store Server API; on Android, the server verifies the purchase token with the Google Play Developer API. Many teams use services such as RevenueCat for this.
Examples
Without receipt validation, people were unlocking premium with a modified app.
Receipt validation fails in the sandbox because the server uses the production URL.
Usage note
Apple's old receipt file is being replaced by signed transactions in StoreKit 2, but many people still say 'receipt validation' for both.
Common phrases
server-side receipt validation · validate a receipt · purchase token · App Store Server API
More about this term →user experience
noun
Meaning
How easily people reach their goals and how they feel when they use a product, service or website, from the first visit to getting help later.
Where you use it
Usually shortened to UX and said letter by letter. Heard in job titles (UX designer, UX researcher), in design reviews and in phrases like 'this hurts the user experience'. It covers the whole product, not only how the screens look.
Examples
Adding two more form steps will hurt the user experience on mobile.
We hired a consultant to review the user experience of our booking app.
Usage note
UX describes an experience, so 'the UX of the logo' sounds odd; for colours, icons and other visual parts, talk about UI or visual design.
Common phrases
improve the user experience · seamless user experience · user experience design · UX designer
More about this term →wireframe
noun
Meaning
A simple, usually black-and-white drawing of a screen that shows where content, buttons and navigation will go, without final colours, images or styling.
Where you use it
Made early in a project, on paper or in tools like Figma, to agree on structure before visual design starts. Also used as a verb: 'Let's wireframe the checkout first.' Grey boxes with an X often stand in for images.
Examples
I sketched three wireframes for the home page so we can compare layouts.
Don't worry about colours yet; this is just a wireframe.
Common phrases
sketch a wireframe · low-fidelity wireframe · wireframe the flow · share the wireframes
More about this term →mockup
noun
Meaning
A static, realistic image of a screen or product that shows the final colours, fonts, images and spacing but cannot be clicked.
Where you use it
Sits between a wireframe and a prototype. Used in client presentations and design reviews to show how the product will look. Also written mock-up, especially in British English; people often say 'mocks' informally.
Examples
The client approved the mockups, so we can start on the prototype.
Can you put the new logo into the App Store mockup?
Usage note
In marketing and graphic design, a mockup can also be a photo template that places a design on a phone, poster or T-shirt.
Common phrases
create a mockup · high-fidelity mockup · present the mockups · device mockup
More about this term →user research
noun
Meaning
The study of people who use or might use a product, through interviews, observation, surveys and tests, to understand their needs, behaviour and problems.
Where you use it
Done by UX researchers or by designers themselves, before and during design. Teams do, conduct or run user research and share the findings in reports or readout sessions. Also called UX research or design research.
Examples
Our user research showed that most customers shop on their phones during lunch breaks.
We don't have budget for a big study, but we can still do some quick user research.
Usage note
Research is uncountable: say 'some research' or 'a research study', not 'a research' or 'researches'.
Common phrases
conduct user research · user research findings · user research plan · share the research
More about this term →persona
noun
Meaning
A fictional but realistic profile of a typical user, built from research, with a name, goals, needs and frustrations, that helps a team design for real people.
Where you use it
Teams create personas after interviews and refer to them by name in meetings ('Would Ayşe understand this?'). Good personas come from research data, not from guesses. The plural is personas.
Examples
Our main persona is a busy parent who orders groceries late at night.
These personas are based on twelve interviews and our support tickets.
Usage note
Stress the second syllable: per-SO-na. The Latin plural personae exists, but designers say personas.
Common phrases
create a persona · primary persona · user persona · persona profile
More about this term →information architecture
noun
Meaning
The way content and features in a website or app are organised, grouped and labelled so that people can find what they need and understand where they are.
Where you use it
Often shortened to IA, said letter by letter. Designers work on IA when planning menus, categories and page structure, using sitemaps, card sorting and tree testing. A messy IA is a common reason why users 'can't find anything'.
Examples
Before we redesign the menu, we need to fix the information architecture.
The information architecture has grown to six levels, which is far too deep.
Common phrases
clear information architecture · restructure the information architecture · information architecture review · IA diagram
More about this term →user flow
noun
Meaning
A diagram or sequence that shows the screens, steps and decisions a user goes through to complete one task in a product, such as resetting a password.
Where you use it
Drawn with boxes and arrows before wireframing, or shown by linking screens in a design tool. People often just say 'flow': the onboarding flow, the checkout flow. Useful for spotting missing screens and dead ends.
Examples
I mapped the user flow for password reset and found two dead ends.
Can you add the error screens to the user flow before the review?
Common phrases
map a user flow · user flow diagram · checkout flow · simplify the flow
More about this term →design system
noun
Meaning
A shared collection of reusable components, design rules, tokens and documentation that keeps a company's products consistent and helps teams build faster.
Where you use it
Many companies publish their design systems, such as Google's Material Design and IBM's Carbon. Designers use, contribute to and maintain a design system; often a dedicated team owns it, both in the design tool and in code.
Examples
Please use the button from the design system instead of drawing a new one.
Our design system has over eighty components, each with code and usage guidelines.
Usage note
A style guide or UI kit is usually only one part of a design system, which also includes code, principles and documentation.
Common phrases
build a design system · maintain a design system · design system team · contribute to the design system
More about this term →visual hierarchy
noun
Meaning
The use of size, colour, contrast, spacing and position on a screen so that people notice the most important elements first and read the rest in a clear order.
Where you use it
A regular topic in design reviews: 'the visual hierarchy is unclear', 'there's no hierarchy here'. Designers build hierarchy with heading sizes, font weight, colour and white space. Often just called 'hierarchy'.
Examples
Everything is bold, so the visual hierarchy is lost and nothing stands out.
A stronger visual hierarchy would make the price easier to spot.
Common phrases
clear visual hierarchy · establish a visual hierarchy · strengthen the hierarchy · lack of hierarchy
More about this term →typography
noun
Meaning
The choice and arrangement of typefaces, font sizes, weights, line height and letter spacing to make text readable and to set the tone of a design.
Where you use it
Designers define a type scale (for example H1, H2, body and caption) in the design system. Common partner words: typeface, font, weight, line height, legibility. Good typography is one of the strongest tools for visual hierarchy.
Examples
The typography feels heavy; try a lighter weight for the body text.
We kept the typography simple: one typeface in four sizes.
Usage note
Stress the second syllable: ty-PO-gra-phy. Strictly, a typeface is the design (Roboto) and a font is one version of it (Roboto Bold), but many people use the two words as synonyms.
Common phrases
typography scale · clean typography · responsive typography · typography guidelines
More about this term →interaction design
noun
Meaning
The part of design that decides how a product behaves when people use it: what happens when they tap, type, swipe or wait, and how the system responds.
Where you use it
Often shortened to IxD. Interaction designers think about states, transitions, feedback, animation and error handling. The word 'interaction' is also used on its own: 'the swipe interaction feels slow'.
Examples
The visuals are done; now we need to work on the interaction design for drag and drop.
Good interaction design tells users that their payment is still being processed.
Common phrases
interaction design pattern · interaction designer · interaction details · define the interaction
More about this term →