Ruuvi Station Android UI/UX test documentation
Temperature, humidity, pressure: setting allows adjusting unit and resolution
Installation, app info
UI/UX checklist
Ruuvi Station app adds Ruuvi Station icon on Android OS and iOS home screen. Icon design features a round Ruuvi “eye”.
App icon shows number of alerts triggered with red counter badge |
---|
App configuration available in OS settings: app permissions, language, notifications, sound settings |
QA checklist
App size after installation Android OS: 72 MB iOS: 121.5 MB
Android OS: notifications, nearby devices iOS: Bluetooth, notifications |
Android OS: Icon counter badge shows number of triggered alerts |
Icon counter badge is hidden by default |
Onboarding
9 app tour screens shown with ability to swipe left-right between screens followed by 2 login screens.
UI/UX checklist
Screens:
2 Dashboard |
3 Personalise |
4 History |
5 Alerts |
6 Share Sensors (A Ruuvi Gateway router is required) |
7 Widgets (A Ruuvi Gateway router is required) |
8 Ruuvi Web App (A Ruuvi Gateway router is required) |
9 Almost there! (continue to sign in) |
1 Benefits |
2 Sign in or create a free Ruuvi account |
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Swipe to left/right works |
Skip button works |
User is able to minimise Benefits screen to go back to last screen of onboarding |
User is able to skip sign in by choosing Continue and No thanks, skip |
User is able to go back to Benefits screen from Sign in using back button |
App requests following permissions: Bluetooth, Notifications, Location (Android) |
Permissions requested on empty dashboard: Notifications, Nearby Devices (Android) |
Notification permission granted |
Notification permission dismissed, will nag for permission again until granted |
Notification permission denied, will not ask again |
Bluetooth permission granted |
Bluetooth permission denied, will not ask again |
Nearby devices permission granted |
Nearby devices permission denied, will nag for permission again until granted |
Main menu
Main menu gives access to main top level features in app.
UI/UX checklist
Main menu is accessible through top left corner of the app indicated by drawer icon.
Tap on drawer icon reveals menu from left side of screen.
Menu tree:
Top |
Menu |
Add a New Sensor App Settings About / Help Send Feedback What to measure with Ruuvi? Buy Ruuvi Sensors Sign in / My Ruuvi Account |
QA checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Menu is shown on the dashboard view after onboarding is completed (first launch) |
Menu can be hidden by swipe right on the menu |
Menu is always shown on dashboard view |
When dashboard view enabled swipe from left side of screen only works on dashboard not on cards scene |
Add a New Sensor brings to Add a New Sensor view |
App Settings brings to App Settings view |
About / Help brings to About / Help screen |
About / Help screen shows changelog, app version, added sensors, locally stored measurements and database size at the bottom of the screen |
What to measure with Ruuvi opens default mobile browser with URL ruuvi.com/ideas , includes language UTM |
Buy Ruuvi Sensors opens default mobile browser with URL ruuvi.com/products, includes language UTM |
Sign in / My Ruuvi Account is either forwarding user to sign in flow or shows a subpage with signed in user email address and ability to delete account or log out |
Add a New Sensor
User is shown a real time list of nearby Bluetooth sensors.
UI/UX checklist
Tap on any listed tag will create a new Sensor Card and add it to the alphabetical location in cards |
Sensors in/out of range are updated using foreground scan interval |
User has ability to scan Ruuvi sensor with NFC on device that supports NFC scanning |
Ta on Add with NFC (iOS) will enable NFC scanning of sensors on iOS |
Menu item (main menu): Add a New Sensor |
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Sensor shows: Default name (Ruuvi + last 4 of MAC address), dBm value, signal strength using volume indicator |
Sensors list sorted according to signal strength (nearest at the top) |
List entries separated by line |
If Bluetooth disabled app requests for permission and shows Bluetooth is disabled status |
Arrow at top left: if no existing sensor cards will show NO SENSORS ADDED, PRESS HERE TO ADD SENSORS placeholder |
If no NFC capability on device the NFC option is hidden |
If no existing sensor cards dashboard will show placeholder |
Arrow at top left: if sensor cards exist will show previous viewed sensor card |
Sensor Cards
Sensor Card will be created when the user taps on the sensor in Add a New Sensor screen or when the user adds sensor by scanning it with NFC.
Alternatively sensor cards can be synchronized from Ruuvi Cloud cloud service when a user is signed in to the application.
Sensor Card shows information regarding a Ruuvi sensor, this can be either real time Bluetooth sensor data or synchronized cloud sensor data.
Ruuvi Station mobile has three different kinds of sensor cards:
Image view (dashboard) |
Simple view (dashboard) |
Full image view |
UI/UX checklist
Image view (dashboard) card elements:
Top |
Sensor name Alert indicator Three Dots Menu |
Main |
Sensor background image Temperature Humidity Air Pressure Movements Data Source Last updated Battery status indicator |
Temperature, Humidity, Air Pressure units and their resolution can be set in App Settings.
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Alert indicator not visible when disabled |
Alert indicator blinking when alert triggered |
Alert indicator bell when alert enabled |
Tap on sensor card opens Full image view or History view according to selected Card action in View menu |
Sensor name shown as non-capitalized, in single line |
Sensor name shows Ruuvi + 4 last of MAC address as default |
Long tag name adapts to fit screen |
Can use emoticon as name |
Name will not link URL or code |
Value separator uses localization: ie comma for EU, dot for US |
Temperature uses units set in App Settings/Temperature unit |
Temperature uses resolution set in App Settings/Temperature |
Humidity uses units set in App Settings/Humidity unit |
Humidity uses resolution set in App Settings/Humidity |
Pressure uses units set in App Settings/Pressure unit |
Pressure uses resolution set in App Settings/Pressure |
Updated ago shows values in h/m/s/ or date + h/m/s |
Updated ago uses foreground interval for Bluetooth sensor when app in foreground |
Data source shows Bluetooth icon or Gateway icon depending on where last datapoint was received |
Adding/removing sensor reflects on Sensor Card list |
Renaming sensor reflects on Sensor Card |
Sensors organize to alphabetical order automatically by default |
Simple view (dashboard) card elements:
Top |
Sensor name Alert indicator Three Dots Menu |
Main |
Temperature Humidity Air Pressure Movements Data Source Last updated Battery status indicator |
Temperature, Humidity, Air Pressure units and their resolution can be set in App Settings.
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Alert indicator not visible when disabled |
Alert indicator blinking when alert triggered |
Alert indicator bell when alert enabled |
Tap on sensor card opens Full image view or History view according to selected Card action in View menu |
Sensor name shown as non-capitalized, in single line |
Sensor name shows Ruuvi + 4 last of MAC address as default |
Long tag name adapts to fit screen |
Can use emoticon as name |
Name will not link URL or code |
Value separator uses localization: ie comma for EU, dot for US |
Temperature uses units set in App Settings/Temperature unit |
Temperature uses resolution set in App Settings/Temperature |
Humidity uses units set in App Settings/Humidity unit |
Humidity uses resolution set in App Settings/Humidity |
Pressure uses units set in App Settings/Pressure unit |
Pressure uses resolution set in App Settings/Pressure |
Updated ago shows values in h/m/s/ or date + h/m/s |
Updated ago uses foreground interval for Bluetooth sensor when app in foreground |
Data source shows Bluetooth icon or Gateway icon depending on where last datapoint was received |
Adding/removing sensor reflects on Sensor Card list |
Renaming sensor reflects on Sensor Card |
Sensors organize to alphabetical order automatically by default |
Full image view card elements:
Top |
Ruuvi logo Alert indicator Charts icon Sensor Card settings icon |
Main |
Sensor Name Temperature Humidity Air Pressure Data source Last updated Battery status indicator Background image |
Temperature, Humidity, Air Pressure units can be set in App Settings.
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Alert indicator greyed when disabled |
Alert indicator blinking when alert triggered |
Alert indicator bell when alert enabled |
Tap on sensor card opens Full image view or History view according to selected Card action in View menu |
Sensor name shown as non-capitalized, in single line |
Sensor name shows Ruuvi + 4 last of MAC address as default |
Long tag name adapts to fit screen |
Can use emoticon as name |
Name will not link URL or code |
Value separator uses localization: ie comma for EU, dot for US |
Temperature uses units set in App Settings/Temperature unit |
Temperature uses resolution set in App Settings/Temperature |
Humidity uses units set in App Settings/Humidity unit |
Humidity uses resolution set in App Settings/Humidity |
Pressure uses units set in App Settings/Pressure unit |
Pressure uses resolution set in App Settings/Pressure |
Updated ago shows values in h/m/s/ or date + h/m/s |
Updated ago uses foreground interval for Bluetooth sensor when app in foreground |
Data source shows Bluetooth icon or Gateway icon depending on where last datapoint was received |
Adding/removing sensor reflects on Sensor Card list |
Renaming sensor reflects on Sensor Card |
Sensors organize to alphabetical order automatically by default |
Dashboard
Dashboard is the default home screen in the app.
If user doesn't yet have any sensors added, app will show an empty placeholder that will suggest user to add sensors. If user has previously signed in to the app but logged out app will show an empty placeholder that will suggest user to sign in or to add sensors.
UI/UX checklist
Dashboard elements:
Top |
Main Menu Ruuvi logo View Menu |
Main (no sensor cards) |
Add a Sensor Sign in |
Main (sensor cards) |
Sensor card (image card) Sensor card (simple card) |
Tap on any sensor card on dashboard will open either Full image view or History view. View action can be selected in View Menu.
QA checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Main menu in Sensor Card view has been replaced with Back button |
Back button in Sensor Card view will bring back to Dashboard |
Scrollable |
If user has no sensors added a placeholder is shown |
Placeholder when user not signed in previously shows Add a sensor button |
Placeholder when user signed in previously shows Sign in and Add a sensor buttons |
Changing temperature units in App Settings reflects on dashboard |
Changing temperature resolution in App Settings reflects on dashboard |
Changing humidity units in App Settings reflects on dashboard |
Changing humidity resolution in App Settings reflects on dashboard |
Changing pressure units in App Settings reflects on dashboard |
Changing pressure resolution in App Settings reflects on dashboard |
Adding/removing sensor reflects on dashboard |
Renaming sensor in Sensor Settings reflects on dashboard |
Sensors organize to alphabetical order automatically by default |
Sensor Settings
Sensor Settings contains settings and information regarding a single sensor.
UI/UX checklist Sensor Settings are accessed via three dots menu on Dashboard or gear icon on the Full Sensor Card. Sensor card settings show sensor information.
Sensor Settings elements:
Top |
Back to Sensor Card view (arrow icon) Background image |
Main |
Background image (Android) Name Owner Owner’s Ruuvi Plan (when signed in and shared sensor) Share (when signed in and sensor owner) Bluetooth Connection (iOS only) Alerts Temperature Air Humidity Air Pressure Signal Strength Movement Connection (iOS) Cloud Connection (when signed in) Offset Correction Temperature Humidity Pressure More info Firmware Remove |
QA Checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
Back icon exists to Sensor Card |
Default Ruuvi background image is set on sensor card creation |
Permissions to use camera/access gallery is requested when first time accessing camera icon on background image subpage |
User can choose from a collection of default images |
User can take photo using device camera |
User can choose image from device internal/external location |
Supported image file formats: jpg, png, typical image formats supported by device. When no support error displayed |
Image automatically scaled to fit various screen sizes, portrait/landscape |
Default sensor name is Ruuvi + last 4 of MAC address |
Sensor Name supports max 32 characters |
Sensor Name supports emoticons |
Sensor Name displayed on single row |
Sensor Name plain text (blocks URL, code) |
Sensor Name if set to empty will show default name as placeholder |
Alerts include alert type, enable/disable, custom description, value range, value set |
User can configure alert even when alert is disabled |
Setting alert disabled remembers previously set range values |
Movement alert only enable/disabled |
Cloud Connection alert uses set value |
Offset Correction is available for Temperature, Humidity and Pressure. If no sensor onboard RuuviTag the offset is greyed out for the specific sensor |
Setting offset will compare difference between original measured value and value that user filled as current known value. |
Setting an offset will reflect everywhere in the app for values reported by the specific sensor on this specific RuuviTag |
Offset will also reflect on values sent by app gateway (Android) and csv file export |
Offset is recorded to Ruuvi Cloud and synced between devices |
Offset is used for sensor that is shared via Ruuvi Cloud |
MAC address can be copied to clipboard |
Firmware shows current version |
If sensor doesn't report current version will show as Old Firmware |
If old firmware in data format 3 user will be shown update popup every time when accessing the sensor settinggs page |
Tap on Update firmware opens a subpage which checks latest firmware version from Ruuvi network and compares it with one on sensor |
If old firmware subpage suggests to update according to instructions on the page |
If latest firmware will report no need to update |
Remove this sensorbutton opens confirmation: Remove sensor Are you sure you want to remove this sensor? You can add it again later, if needed. Cancel, Confirm |
Removing sensor deletes sensor card from it’s location in sensor cards |
History view
History view visualizes temperature, humidity and air pressure in charts.
UI/UX checklist
History view is accessed by tap on sensor card (dashboard) when user has set card action to Open history view in View menu, choosing History view from three dots menu or by pressing charts icon on Sensor Card. History View contains Temperature, Humidity, Pressure charts. Temperature, Humidity, Air Pressure units and their resolution can be set in App Settings and they reflect on Charts X,Y values. Charts also uses Chart Settings in App Settings and calibration settings in Sensor Settings for specific sensor.
History view also contains button to sync sensor history from RuuviTag internal memory via Bluetooth and export for exporting collected sensor history into a csv file.
Charts elements:
Top |
Sensor Name Move to next/previous sensor card Sync sensor history from Bluetooth View selector Three dots menu |
Main |
Chart temperature, values X,Y, min/max/avg for current viewport (when min/max/avg set to visible in three dots menu), latest datapoint, tap to view datapoint info |
Chart humidity, values X,Y, min/max/avg for current viewport (when min/max/avg set to visible in three dots menu), latest datapoint, tap to view datapoint info |
Chart pressure, values X,Y, min/max/avg for current viewport (when min/max/avg set to visible in three dots menu), latest datapoint, tap to view datapoint info |
QA checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
On landscape mode user will see 1 chart and can scroll down/up to view other charts |
Tap on charts icon exists to Sensor Card |
Tap on arrows moves to previous/next sensor card |
If last or first card only one arrow available |
Values use localization (ie comma for EU, dot for US) |
Chart settings (set in App Settings) reflect on History view |
Temperature units (set in App Settings) reflect on History view |
Pressure units (set in App Settings) reflect on History view |
Calibration settings (set in Sensor Settings) reflect on History view |
Pinch to zoom in/out navigates on charts |
Pinch to zoom adjusts zoom value on all charts regardless of which chart is zoomed |
Tap on datapoint shows info for selected datapoint in chart |
App Settings
App Settings contains global settings for Ruuvi Station.
UI/UX checklist
App Settings is accessed via main menu item App Settings.
Menu tree:
Language Appearance Alert Notifications Background Scanning Temperature Humidity Pressure Ruuvi Cloud Chart Settings Data Forwarding (Android only) Defaults (internal only) |
QA checklist
Matches design |
Elements scale on various screen sizes |
Portrait, landscape modes |
App settings: changes are saved when app killed |
App settings: unit settings are synced from cloud |
Language: user will be forwarded to app language settings in OS |
Language: app language may differ from OS language (iOS and Android OS 13 or higher) |
Appearance: appearance setting follow system theme when system selected |
Appearance: light or dark theme matches design |
Alert notifications: when enabked Bluetooth alert will trigger 1 time per 1 hour even if it was retriggered. |
Alert notifications: alert sound forwards to sound alert settings in Android OS |
Alert notifications: alert sound opens it's own subpage in iOS |
Background scanning: When enabled app will collect data points according to the selected interval when app is minimized in the background |
Background scanning: In iOS app user will need to also pair sensor in Sensor Settings in order for data points to be recorded according to this interval |
Background scanning: When disabled no data points will be collected when app minimised |
Background scanning: default enabled, data logging interval 5 mins |
Background scanning: Some Android devices optimise heavily for battery usage and may snooze apps running in the background, which effects background scanning |
Background scanning: Removing optimisation features will make app record data points in background smoothly |
Background scanning: switches between foreground/background |
Background scanning: scan interval is reflected in CSV export |
Background scanning: background scanning enabled Ruuvi icon appears at top left of device screen when app minimized to indicate scanning is on Background scanning: notification drawer will display sticky notification for scanning interval Scanning every m-s. |
Temperature, humidity, pressure: setting allows adjusting unit and resolution |
Temperature, humidity, pressure: setting reflects everywhere in app and also in CSV export |
Chart settings: show all measurements will draw all recorded datapoints to history view page |
Chart settings: show datapoints will add points to all recorded datapoints on Android OS |
Data forwarding: user gives URL in correct format - app will use app internal interval to send data with POST |
Data forwarding: device identifier is free text, a pre-generated id is shown by default |
Data forwarding: sending location coordinates of device with data adds location data to POST |
Data forwarding: beta feature forward data while syncing works |
Data forwarding: test data forwarding button gives either error or success for HTTP POST attempt |
Data forwarding: URL allows max 200 characters |
Data forwarding: Device identifier allows max 64 characters |
Defaults: normally hidden and not available in production builds |
Defaults: internal testing features and settings |
Last updated