Picture Perfect: Kiosk Artwork & Image Specs Guide 🖼️✨
Creating an eye-catching, high-converting self-service kiosk starts with great visual media! Because your kiosk terminal runs in landscape mode, uploading high-resolution graphics that fit the exact screen shapes ensures your dishes look mouthwatering and your brand graphics display crisp and clear. 📸🤩
This guide breaks down all the image sizes, shape ratios, and cropping behaviors for every photo on your NX Kiosk screen!
Quick Reference Artwork Guide 📐
When preparing graphics for your design or media teams, use this quick reference chart to get the exact dimensions needed for every kiosk screen element:
| Artwork Type 🖼️ | Where It Appears 📍 | Shape / Ratio 📏 | Recommended Resolution 🎯 | Cropping Behavior ✂️ |
| Idle Background | Full-screen idle attract screen | Widescreen Landscape (~16:9) | 1920×1080px min (2560×1440px+ for larger screens) | Configurable (Fit or Crop) |
| Idle Rotating Slides | Slideshow behind "Touch to Order" button | Widescreen Landscape (~16:9) | 1920×1080px min | Configurable (Defaults to Crop) |
| Category Icon (Tab Row) | Top horizontal category buttons | Square (1:1) | 108×108px min | Center crop with circular mask |
| Category Icon (Sidebar) | Left vertical category column | Square (1:1) | 156×156px min | Center crop with rounded-square mask |
| Menu Item Tile Image | Category menu browsing grid | Landscape (~6:5 to ~16:9) | 960×510px min | Center crop to fill tile |
| Item Detail Image | Item customization screen | Square (1:1) | 600×600px min | Center crop with rounded-square mask |
| Modifier Choice Images | Modifier selection options (e.g., sauces) | Landscape / Rectangular | 570×360px min | Center crop |
1. Idle Attract Screen Images 📺
The idle screen plays on your terminal while waiting for guests to start an order. You can configure two distinct graphic options under the Idle Screens tab in NX Portal:
Background Image
The base background image displayed behind your primary "Touch to Order" button.
- 📐 Orientation: Widescreen landscape (~16:9 ratio).
- 🎯 Resolution: Minimum 1920×1080px (provide 2560×1440px or larger for large 21.5″–28″ screens).
- ✂️ Scaling Modes: Select Crop (fills the screen completely; may cut off outer edges) or Fit (displays the full graphic without cutting off edges; may add letterbox sidebars).
- Tip: Use Fit for logos or key text graphics so nothing gets cut off! Use Crop for general photography.
Rotating Slides
An optional slideshow of food photography, promotional banners, or logos that rotate automatically behind your start button.
- 📐 Orientation & Size: Same landscape treatment as the background image (1920×1080px minimum).
- ✂️ Scaling Modes: Defaults to Crop unless explicitly set to Fit.
Portrait Hardware Note: NX Kiosk is designed for widescreen landscape displays. If your terminal hardware is physically mounted vertically in portrait, Android automatically adjusts the layout. The app will use the same image files and scale them to fit the narrower screen width.
2. Menu Category Images 🍔
Category images display as small navigation icons to help guests hop between menu sections. Because these render as small cropped icons, keep your subject centered and simple!
Depending on your venue's Category Layout setting in Portal, category icons appear in one of two formats:
- ⭕ Horizontal Tab Row (Top Navigation): Icons display at ~36dp with a circular mask. Supply square images at 108×108px minimum.
- ⏹️ Vertical Sidebar (Left Navigation): Icons display at ~52dp with a rounded-square mask. Supply square images at 156×156px minimum.
3. Menu Item Tile Images 🍕
Item images display directly inside the menu grid while guests browse categories.
Because tile widths adapt automatically to different terminal screen sizes, image aspect ratios adjust dynamically:
| Terminal Screen Size | Approx. Tile Width | Effective Aspect Ratio |
| Compact Displays (~15.6″) | 200dp | ~6:5 |
| Regular Displays (~21.5″ - Default) | 260dp | ~3:2 |
| Large Displays (~28″+) | 320dp | ~16:9 |
Best Practices for Item Photos 📸
- 🎯 Resolution: Supply source photos at 960×510px minimum.
- 🎯 Centering: Keep your food or product subject centered in the frame so it looks great whether cropped slightly narrower or wider!
✨ Corners: NX POS automatically applies soft rounded corners to item tiles on screen—no need to pre-round your image corners before uploading!
4. Item Detail & Modifier Images 🥗
When a guest taps an item tile to customize their order, a detailed pop-up view appears showing the main dish image alongside modifier options:
- 🖼️ Main Item Detail Image: Displays adjacent to the item title, description, and price. Upload a square 1:1 ratio image at 600×600px minimum. The system automatically applies a center crop and rounded-square mask.
- 🍟 Modifier Option Images: If a modifier group has images enabled (e.g., visual choices for pizza toppings or dipping sauces), upload rectangular photos at 570×360px minimum.
Step-by-Step: Uploading Artwork in NX Portal ⚙️
- Open Image Library:Access venue assets.
Log into NX Portal, navigate to Venue ➔ Images (or open the image picker directly while editing a Kiosk setup profile). - Upload High-Res Files:Upload original media.
Drag and drop your high-resolution PNG or JPG files into the media uploader. - Let NX Handle Sizing:Automatic image processing.
NX POS automatically generates small, medium, and large optimized web formats for your terminals. - Attach & Preview:Assign to kiosk screens.
Assign your uploaded graphics to your Idle Screens, Categories, or Menu Items, and review the results instantly in the Kiosk Builder Live Preview frame!
Troubleshooting Artwork Issues 🔍
- 🔴 My background image looks stretched or blurry?
- Check your source file resolution! Ensure your background graphic is at least 1920×1080px (or 2560×1440px for large displays).
- ✂️ Important text or logos are getting cut off on the edges?
- Switch your idle screen Image Scaling setting from Crop to Fit. This ensures the entire image displays on screen without clipping outer edges.
- ⭕ Category icons are hiding the edges of my logo?
- Category images are cropped into circles or rounded squares from the exact center. Ensure your logo or dish is centered with plenty of padding space around the outer edges.
Need Additional Support? 💬
If you need help optimizing your media or configuring your kiosk displays, reach out directly to NX Restaurant Support for assistance! 🌟