Closed Bug 863710 Opened 7 years ago Closed 7 years ago

Turn the status bar to a transparent status bar when the device is locked

Categories

(Firefox OS Graveyard :: Gaia::System, defect)

x86_64
Linux
defect
Not set

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: vingtetun, Assigned: epang)

References

Details

(Whiteboard: visual design, u=user c=lock s=ux-most-wanted)

Attachments

(12 files, 2 obsolete files)

154.02 KB, image/png
jcarpenter
: feedback-
Details
100.72 KB, image/png
Details
36.13 KB, application/zip
Details
269.74 KB, image/png
Details
268.72 KB, image/png
Details
120.31 KB, image/png
Details
122.07 KB, image/png
Details
114.36 KB, image/png
Details
69.91 KB, application/zip
Details
26.82 KB, image/png
Details
463 bytes, text/html
yurenju
: review+
Details
35.89 KB, application/x-zip-compressed
Details
Attached patch Patch without icons. (obsolete) — Splinter Review
The patch needs some love, mostly about transparent icons.

In addition the patch will solve an usability issue where there is no clock on the statusbar while you're doing a phone call.

Josh feel free to have someone taking this patch to add the missing icons if that can help to go faster.
Attachment #739592 - Flags: feedback?(jcarpenter)
Eric, we'll need transparent versions of our status bar icons for this patch, which makes the status bar transparent on the Lock screen (a nice little win for visual design attractiveness).
Assignee: nobody → epang
Flags: needinfo?(epang)
Whiteboard: visual design, u=user c=lock s=ux-most-wanted
(In reply to Vivien Nicolas (:vingtetun) (:21) from comment #0)
> Created attachment 739592 [details] [diff] [review]
> Patch without icons.
> 
> The patch needs some love, mostly about transparent icons.
> 
> In addition the patch will solve an usability issue where there is no clock
> on the statusbar while you're doing a phone call.
> 
> Josh feel free to have someone taking this patch to add the missing icons if
> that can help to go faster.

I'm embarassed to admit I don't know how to apply and review patches to Gaia (was supposed to go over it with Casey in Madrid, but we ran out of time), so I'll need a screenshot.
Attached image Transparent statusbar
(In reply to Josh Carpenter [:jcarpenter] from comment #2)
> (In reply to Vivien Nicolas (:vingtetun) (:21) from comment #0)
> > Created attachment 739592 [details] [diff] [review]
> > Patch without icons.
> > 
> > The patch needs some love, mostly about transparent icons.
> > 
> > In addition the patch will solve an usability issue where there is no clock
> > on the statusbar while you're doing a phone call.
> > 
> > Josh feel free to have someone taking this patch to add the missing icons if
> > that can help to go faster.
> 
> I'm embarassed to admit I don't know how to apply and review patches to Gaia
> (was supposed to go over it with Casey in Madrid, but we ran out of time),
> so I'll need a screenshot.

No worries. I have mostly have you a feedback? to get your attention on this bug since we discussed it quickly.

Let me attach 2 screenshots.
Attachment #740233 - Flags: feedback?(jcarpenter)
Comment on attachment 740233 [details]
Transparent statusbar

I suspect we'll want to make the bar partly visible. eg: Black, but at 20% opacity or some such. I'll cc the visual team for input.
Attachment #740233 - Flags: feedback?(jcarpenter) → feedback-
Comment on attachment 740234 [details]
Transparent statusbar with an attention screen (not transparent then).

Moving approval for this bug to Patryk
Attachment #740234 - Flags: feedback?(jcarpenter) → feedback?(padamczyk)
Static Status Bar Icons.
Flags: needinfo?(epang)
Comment on attachment 740234 [details]
Transparent statusbar with an attention screen (not transparent then).

Josh, do we even need the status bar in these dialogs... feels unnecessary since the user HAS to act on it.

If it needs to be there due to technical limitations. I'd prefer I translucent black bar... maybe 40%, so make the status bar look less heavy / distracting.
Attachment #740234 - Flags: feedback?(padamczyk) → feedback?(jcarpenter)
(In reply to Patryk Adamczyk [:patryk] UX from comment #8)
> Comment on attachment 740234 [details]
> Transparent statusbar with an attention screen (not transparent then).
> 
> Josh, do we even need the status bar in these dialogs... feels unnecessary
> since the user HAS to act on it.

I think there's merit in displaying the status bar for the incoming call and active alarm screens. In both instances you're looking at a phone after a period of inactivity (potentially several hours, in the case of a night's sleep), and the battery life, pending notifications and signal strength indicators are valuable contextual information even before the user acts on the alert. Particularly in case of phone call.

Re: translucency, I'd say let's mock it up and then see if we can implement it either with this bug, or separately.
(In reply to Josh Carpenter [:jcarpenter] from comment #9)
> (In reply to Patryk Adamczyk [:patryk] UX from comment #8)
> > Comment on attachment 740234 [details]
> > Transparent statusbar with an attention screen (not transparent then).
> > 
> > Josh, do we even need the status bar in these dialogs... feels unnecessary
> > since the user HAS to act on it.
> 
> I think there's merit in displaying the status bar for the incoming call and
> active alarm screens. In both instances you're looking at a phone after a
> period of inactivity (potentially several hours, in the case of a night's
> sleep), and the battery life, pending notifications and signal strength
> indicators are valuable contextual information even before the user acts on
> the alert. Particularly in case of phone call.
> 
> Re: translucency, I'd say let's mock it up and then see if we can implement
> it either with this bug, or separately.

Hi Josh, I'll create mock ups once Vivien gets back to us about the transparent animated icons.  If we can use sprites we'll be able to do either option :) (transparent or translucent). Thanks!
Created animated status bar icons as APNGs.
Attached image Radial Gradient Overlay
Hi Vivien,  I've attached the radial gradient overlay for the lock screen - with this the status bar can be completely transparent.  Thanks!
Attached file Pull Request
Attachment #739592 - Attachment is obsolete: true
Attachment #742359 - Attachment is obsolete: true
Attachment #743672 - Flags: review?(yurenju.mozilla)
Attachment #743672 - Flags: review?(yurenju.mozilla) → review+
I think the image miss a vibration icon and that makes me very confused when I am testing my multi-channel silent mode patch....*sad* *Why my vibration icon never appears!?* *uh...no image....*
(In reply to Alive Kuo [:alive] from comment #21)
> I think the image miss a vibration icon and that makes me very confused when
> I am testing my multi-channel silent mode patch....*sad* *Why my vibration
> icon never appears!?* *uh...no image....*

Looks like you're right, it misses :)
Peter, do we have a status bar icon for vibration?  If so, should it be added? Thanks!
Flags: needinfo?(pla)
Hey Eric,

We don't have such an icon currently.  We've never been asked to do one.  If they need it, yes please add it.

Thanks,
Peter.
Flags: needinfo?(pla)
Hi, I've added the vibration icon back into the status bar sprite.
Flags: needinfo?(alive)
Done at 870316.
Flags: needinfo?(alive)
You need to log in before you can comment on or make changes to this bug.