Questions tagged [progress-bar]
An interface element that indicates the progress of process by filling a percentage of a shape (usually a rectangle or a bar) with a color. The percent of the bar that is filled reflects the progress (If the action is 25% complete, the progress bar will be 25% full).
157 questions
0
votes
2
answers
95
views
How to show progress in surveys with both required and optional questions?
I’m designing a mobile survey platform that includes both required and optional questions. It's very simple with a scrolling format, so all of the questions are available at once- I don't think I can ...
- 1
0
votes
1
answer
75
views
How to change a progress dialog to indicate dismiss instead of cancel?
I am currently writing a wxWidgets application as a tool to perform a task. This task is asynchronous and occurs in a different thread. I pop up a dialog box & disable the main window when the ...
- 101
1
vote
1
answer
62
views
Do we call all types of progress indicators a loader?
Do we call all types of progress indicators a loader.
- 11
2
votes
4
answers
368
views
Direction of progress bar
Somewhat related to:
Progress - When should I go from 100% to 0%, or vice versa?
I'm wondering if it's appropriate for a progress bar which is a countdown to go from right to left. That is, in this ...
- 31
0
votes
1
answer
698
views
User's expected behavior when uploading files before submitting
Problem:
I have a form that has a couple fields, but also asks for the user to upload files. Potentially, the user might upload multiple files, so we are saving them (kinda like saving drafts), but ...
- 1,414
1
vote
1
answer
43
views
Should indeterminate progress indicators distinguish between progress / lack of progress?
If an application has a possibility of not progressing (hung thread, indefinite network timeout, etc.) how should an indeterminate progress indicator behave, so that a user knows when to give up?
I've ...
- 875
0
votes
1
answer
159
views
Pause and cancel button next to each other?
So I am designing a feature for our app that allows users to pause, resume, and cancel their app's updates. I came up with a design that allows for the user to tap on the icon to pause/resume and ...
- 1,334
0
votes
1
answer
175
views
HTTP request linear progress indicator color
I am showing a fixed horizontal progress line at the very top of may Web page that is as long as the viewport width. It is displayed when an HTTP request is pending.
It is similar to the Indeterminate ...
- 131
3
votes
2
answers
282
views
How to show student progress on a teacher dashboard?
I'm designing a dashboard for teachers to monitor the progress of their students. This screen can have 20 to 50 students and when the teacher selects a start date, I would like to show the difference ...
- 344
3
votes
1
answer
2k
views
Progress Steppers (Progress Bars) vs Tabs
I'm currently designing an intranet application for my client.
About the application:
Users are required to fill in large amount of data (about 20-30 fields, depending). For example, creating a new ...
0
votes
2
answers
1k
views
User Experience for non linear steps
We are in process of creating guided user experience for simplifying onboarding on multiple processes, services and teams. End User will be tech users only.
Our web application will create multiple ...
- 101
9
votes
4
answers
2k
views
How to indicate spend limit?
I have max limit (in this case $180) and progress indicator how much was spent ($50)
What is the best/effective way to show user that he/she
Has max limit $180
Spent $50
Can spend $130 more
It ...
- 45
4
votes
2
answers
563
views
Progress bar design with text overlay
I have a progress bar in my app where I want to display the amount done with a text overlay.
What I have is the text overlay begin centered in side the amount that is done so it looks like this
The ...
- 143
1
vote
1
answer
166
views
Progress for Data Table
Users are accustomed to viewing data within a data table. The problem is the user cannot complete one action until another action is completed. Is there a better way to lay this out, but also give the ...
- 53
3
votes
2
answers
2k
views
Displaying a progress bar results in slower completion time
I write a lot of internal scripts that automate tasks for a team. In order to prevent them from wondering if the script has "halted", I display a simple progress bar for the long running ...
- 131
1
vote
1
answer
147
views
How can I show the relationship between two progress/health bars?
In a turn based game I'm building you manage a few resources, two of which are related.
Speed: a frequently changing value that you consume over the course of a turn as you act.
Endurance: a rarely ...
- 147
1
vote
0
answers
70
views
Are there any similar progress bars with interactions like this?
I'm actually looking at circular progress bars that can fit in the 45px x 45px space, as such there's a limit to what can be displayed (so the typical long and narrow progress bar isn't going to work ...
- 21
2
votes
3
answers
222
views
How to make sure the user does not inadvertently dismiss a modal?
I'm working on a page editor where you have the ability to insert images from an external/third-party source. The library of images will be displayed in a modal that sits on top of the page editor. ...
- 1,414
2
votes
2
answers
696
views
Android FAB with progress indicator
Is a good idea to put (infinite) progress indicator into a Floating Action Button (FAB)?
I am dealing with a situation where there is a bottom navigation panel with inset FAB and there is no toolbar ...
- 123
1
vote
2
answers
138
views
Make a simultaneous selector and display for decibels
I'm creating an android app that. I want to create a display for decibels that shows the actual noise captured by the phone. At the same time, I want the user to have an option to select the level of ...
- 11
2
votes
2
answers
495
views
How to let users know about auto filled or skipped steps in form progress tracker?
We are implementing a progress tracker for a 3 step task. However, step 2 ('review step 1') is not always applicable; it's only applicable if one validation check after the submission of step 1 fails. ...
- 31
0
votes
3
answers
2k
views
Why add a progress bar on the shopping cart?
10 years ago it was common to see a progress bar on the shopping cart. Nowadays is not so common. Why?
Are we still needing to add progress bar on shopping carts?
My new shopping cart template.
- 1,522
1
vote
3
answers
3k
views
Progress tracking/Stepper UI/UX research
I'm currently working on an application where users complete a flow of tasks, divided over multiple pages.
For this application, I'm considering using a progress tracking/stepper UI element. However, ...
- 111
1
vote
4
answers
444
views
Compact way to represent a progress with many sub-operations?
I have the following way of representing a long-running operation, it is detailed in the sense that every sub-operation progress is shown:
(it's currently shown in a text mode application but final ...
- 129
0
votes
3
answers
703
views
Progress bar or text label for progress in a list view
I have a scenario like the one below:
There's a mobile app screen with a list view and there is FAB to add items to list view. Think of the app as something like Jira.
So let's say the list items in ...
- 717
0
votes
3
answers
412
views
Status Bar with several Stage
I would like to have some opinion on the design, I made to represent the product process QTY.
At each stage, i should show to the user, how many of his requested product has been proceed.
If there are ...
- 25
1
vote
1
answer
2k
views
States and behaviour for progress bars embedded in tables
These days it is not uncommon for data tables to contain more complex UI elements (i.e. not just data), with things like pills (or tags), call-to-action buttons, icons, and even graphs & charts (e....
- 27.7k
5
votes
3
answers
685
views
Should progress bars accurately reflect how close the operation is to completion during long operations?
I'm creating a simple application. There's a certain operation that will take a long time to complete (~15 minutes), and I'm hoping to make a progress bar showing how close the operation is to ...
- 155
1
vote
2
answers
574
views
Adding label or supporting text to a loading animation (spinner)
I have an interactive map container that requires some time to load. I placed an animated loading spinner while the map loads.
Is the animated spinner sufficient visual feedback or should it be ...
- 33
2
votes
3
answers
966
views
How to show progress bar and percentage value in a compact space?
I need to develop a kind of information dashboard, with a sizable number of widgets like this, to show progress on a bunch of things:
I need to show the percentage value and the percentage complete, ...
- 571
1
vote
1
answer
83
views
What is the best way to indicate both the exact and relative remaining portion of a resource in a single element?
In the game I'm building, characters have a resource called Speed that they are frequently spending and regaining each turn. Think something akin to Action Points if you're familiar with tactical ...
- 147
3
votes
2
answers
823
views
Progress bar - single or multiple for multi-step process?
Is it better to switch status bars in-place when the next process occurs? Or do users prefer to see stacked bars for each step?
I am developing a status page where the user submits data and the ...
- 165
1
vote
0
answers
89
views
Website progress tracker [duplicate]
I’m working on an application that has multiple tasks that need to be completed in sequence (e.g. think placing your order with amazon). We have a progress bar at the top of the web page which shows ...
- 11
2
votes
2
answers
158
views
Distorting data on progress bars?
I am currently doing some research on how data is sometimes distorted during visualization on progress bars (showing 70% instead of 50% etc). The research is focused on expanding the thesis of Chris ...
2
votes
1
answer
404
views
Nomenclature for all parts of a progressbar
I'm looking to get a name for all off the different parts of a progressbar.
e.g.
Loading [ =====> ] 1/20 (5%) done
I want to know what name can be given to the following parts:
"Loading" ...
- 123
2
votes
3
answers
2k
views
Is there a name for this type of progress bar at the top of screens?
Lots of applications and sites (particularly SPAs or sites with lots of data to load such as YouTube) have a progress bar that is displayed at the very top of the screen.
Does this have a special ...
- 161
2
votes
1
answer
71
views
Sequential representation of a parallel process? (skyscanner search progress) [closed]
When I search for flights on Skyscanner, it first shows a "Searching" screen with a spinner, then shows some results along with a progress bar and indicators stating "Searched 28/30 providers" and "...
- 121
2
votes
1
answer
60
views
Examples and suggested principles of designing dissipating usage tracking experiences?
I was wondering if anyone could assist, I'm not sure what the correct terminology for this is, and therefore struggling to find any research on it.
I'm designing an experience where users have a ...
- 31
3
votes
5
answers
2k
views
How to implement busy spinner with button
What should happen when a user clicks on a button that triggers an action that takes a short amount of time to complete, showing a busy spinner to indicate processing?
[click]↖ ⇒ [click] ↖⚙ - Mouse ...
- 831
3
votes
1
answer
147
views
How to display progress from one stop to the next stop on a continuous scale?
Which is more intuitive?
Option #1 (top picture): Progress bar starts at 1,500 (previous privilege) and ends at 2,000 (next privilege)
Option #2 (bottom picture): Progress bar starts at 1 (the ...
- 831
2
votes
1
answer
824
views
What are the best UX practices to show that an autocomplete data for an input field in a form is loading?
I'm a developer working on a form, which fills an autocomplete input field with available choices.
What would be the a good UX take to show that those suggestions are loading?
I'm thinking on ...
- 123
3
votes
1
answer
251
views
Is showing temporary result immediately better ux than showing a loading indicator until a result is available?
Use case: There is a toggle button a user can click on it. After the user clicked on it, it should show a result, success or failure. It takes some process time to calculate the result. Unless error ...
- 133
25
votes
3
answers
8k
views
Progress - When should I go from 100% to 0%, or vice versa?
I have a web app I'm building for my business which essentially tracks an employee's progress doing a pick in a warehouse.
The interface has a progress bar that's colored in, and it's full, and as ...
- 353
2
votes
1
answer
181
views
Do loading bars freeze on purpose?
Many applications implement some sort of progress bar or spinning circle to indicate loading of significant size.
In Windows 10 updates and some games, I've noticed that these loading elements ...
- 21
4
votes
3
answers
2k
views
iOS button morph to loading
In Android, the native button in material style has a "loading" state. This loading state can also be "disabled" state. It looks like this:
HD Screencast - https://gfycat.com/...
- 279
1
vote
1
answer
672
views
Data Visualization: Visualizing current year annual performance by juxtaposing last year total and year to date numbers
Working on a revenue piece where I have to show current YTD ( Year to date ) performance with last year’s YTD and the total revenue last year for a specific product.
The below image shows the ...
- 642
4
votes
1
answer
674
views
Fractions ("X out of Y complete") in RTL Languages
We are working on RTL support in an application. One of the elements in our app is a progress bar that shows the number of slides of a deck that the users has completed, as well as a graphical ...
- 143
2
votes
3
answers
202
views
How to represent small data on a progress bar?
Say I have a file scan and after it has complete we want to display the files infected vs non. How could I go about representing this without the data seeming so minuscule within large file quantities?...
- 1,199
5
votes
2
answers
2k
views
Skeleton screens with determinate progress?
I'd like to use skeleton screens to indicate when a page is loading. Usually, this is great—it makes the experience seem faster while still functioning as a progress indicator.
The thing is, skeleton ...
- 1,455
5
votes
2
answers
483
views
Progress bars to indicate user count & competition end date for mobile
This is my scenario.
I have a promotion that ends at a particular time. Only if the number of entries reaches a particular threshold will the promotion take place.
So to users I have to show ...
- 51