Implement revised SIM PIN visual design

RESOLVED INVALID

Status

Firefox OS
Gaia::System
P4
normal
RESOLVED INVALID
6 years ago
4 years ago

People

(Reporter: GH to BZ, Unassigned)

Tracking

({polish})

unspecified
polish
Dependency tree / graph

Firefox Tracking Flags

(blocking-b2g:-)

Details

(Whiteboard: visual design, BerlinWW, uxbranch, [EU_TPE_TRIAGED])

Attachments

(2 attachments)

(Reporter)

Description

6 years ago
[GitHub issue by fabi1cazenave on 2012-09-25T05:47:33Z, https://github.com/mozilla-b2g/gaia/issues/5122]
The SIM PIN unlock window is now a Settings webActivity and it looks like an application panel.

I believe it should be a System-like dialog, like the time picker, i.e. on a dark background and with large OK/Cancel buttons.

/cc @evelynhung
(Reporter)

Comment 1

6 years ago
[GitHub comment by jcarpenter on 2012-09-25T07:31:42Z]
@lco and @rafaelrebolleda Can you comment here? @evelynhung and @krupa have questions about current SIM specs.
(Reporter)

Comment 2

6 years ago
[GitHub comment by rafaelrebolleda on 2012-09-25T16:27:20Z]
Can we reuse the lock screen PIN interface in some fashion?
(Reporter)

Comment 3

6 years ago
[GitHub comment by fabi1cazenave on 2012-09-25T19:10:26Z]
I guess so. @evelynhung, would that be okay with you?
(Reporter)

Comment 4

6 years ago
[GitHub comment by evelynhung on 2012-09-26T13:08:10Z]
The main difference of lock screen PIN and SIM PIN is digit length, SIM PIN is 4 to 8 digits. and if the user fail to enter a correct SIM PIN, a PUK unlock screen is displayed with 3 input fields. (puk, new PIN, confirm new PIN)
(Reporter)

Comment 5

6 years ago
[GitHub comment by caseyyee on 2012-09-26T19:55:19Z]
Reusing the lock-screen pin entry interface makes the most sense to me.   The only thing that we'll have to adjust is the title text and visual design to fit the variability in digit length.   So rather than the 4 boxes for each digit of the pin, we could probably just use a standard input field.

@patrykdesign, thoughts?
(Reporter)

Comment 6

6 years ago
[GitHub comment by autonome on 2012-09-28T16:25:18Z]
Is there any functional piece that does not work, or is this purely about look-and-feel?
(Reporter)

Comment 7

6 years ago
[GitHub comment by autonome on 2012-09-28T16:25:41Z]
Please re-nominate if there is a bug.
(Reporter)

Comment 8

6 years ago
[GitHub comment by patrykdesign on 2012-09-28T18:59:34Z]
@caseyyee I'd opt for reusing the UI but modifying any text if needed. Unlock UI makes sense to me.

Comment 9

6 years ago
(In reply to GH to BZ from comment #4)
> [GitHub comment by evelynhung on 2012-09-26T13:08:10Z]
> The main difference of lock screen PIN and SIM PIN is digit length, SIM PIN
> is 4 to 8 digits.

That makes me grin, as I'm used to having 5-digit lock codes (Nokia always had that requirement on their old entry-level phones and I stuck to it), I was confused when ours only allowed 4 digits. ;-)

That said, as soon as I saw the unlock screen design I immediately jumped and was "I want this for the PIN entry screen as well"!

I hope we can find some way to use the same style of design. On the Nokia N9, they did an interesting tweak with coloring the entry fields differently so that you can immediately spot which code is required if you have both activated. If you like to see that as a reference, I can make images of that and attach them here.
Whiteboard: [label:settings][label:needsUXinput][label:telephony] → visual design
Functions fine, needs some visual polish.
Keywords: polish
Priority: -- → P4
Please make sure to follow the bug this one depends on if someone works on polish.
Depends on: 804966
cc'ing Vicky for revised visual design. Current is very rough.
Summary: SIM PIN unlock should be a System-like dialog → Implement revised SIM PIN visual design
Whiteboard: visual design → visual design, BerlinWW
Duplicate of this bug: 804278
Created attachment 699133 [details]
Visuals for the passcode screens in settings
Please find attached the revised visuals for the SIM PIN entry and creation and also PassCode creation and modification.

Note that the SIM PIN unlocking is not the same as Unlocking the phone with pass code. SIM PIN happens after unlocking and can have from 4 to 8 digits, while the lock security code is used to unlock screen and has only 4.
Created attachment 699134 [details]
Visuals for settings sim PIN in settings and unlocking phone
Please note that SIM PIN and Passcode keyboards are like the unlocking passcode screen in the lockscreen and not the one implemented right now.
Assignee: pivanov → nobody
Assignee: nobody → arthur.chen
Hey there Arthur, are you actively working on the implementation of this already or can I steal it? Thanks!
Flags: needinfo?(arthur.chen)
Hi Schalk,
I'm working on it. It takes a little bit more time than I expect because there are some behavioral changes here. I think I can handle that, thanks!
Flags: needinfo?(arthur.chen)
Hi Victoria, two things that need your confirmation:
1. I noticed that the visual feedback of entering a correct passcode has been removed from the lock screen. When setting a passcode, once the user inputs a correct passcode in the "confirm passcode" step, are we going to show any visual feedback? 
2. Since users can only input numbers, do we still need alphabet displayed on the keyboard (both in the lock screen and settings app)?

Thanks!
Flags: needinfo?(vpg)
blocking-b2g: --- → tef?
(In reply to Arthur Chen [:arthurcc] from comment #20)
> Hi Victoria, two things that need your confirmation:
> 1. I noticed that the visual feedback of entering a correct passcode has
> been removed from the lock screen. When setting a passcode, once the user
> inputs a correct passcode in the "confirm passcode" step, are we going to
> show any visual feedback? 
> 2. Since users can only input numbers, do we still need alphabet displayed
> on the keyboard (both in the lock screen and settings app)?
> 
> Thanks!

1. when setting a passcode we better have the "create" button in the header disabeled until the user types twice the same code and that hsould be feedback enough.
2. You can remove letters from that keyboard.

Thanks!
Flags: needinfo?(vpg)
Whiteboard: visual design, BerlinWW → visual design, BerlinWW, uxbranch
blocking-b2g: tef? → -
blocking-basecamp: - → ---
Whiteboard: visual design, BerlinWW, uxbranch → visual design, BerlinWW, uxbranch, [EU_TPE_TRIAGED]
Victoria, 
About changing SIM PIN, we have no API of checking the current PIN, which means users have to provide current PIN, new PIN and the confirming PIN at once instead of step by step. I have two options as the following:

1. Request adding a new API of checking the current PIN from the platform side. 
2. Do the checking after users provide all information (current PIN, new PIN, and confirming PIN).

Any suggestions?
Flags: needinfo?(vpg)

Updated

5 years ago
Duplicate of this bug: 822452
Arthur, what's the status of this bug? Have you received info from Victoria?
Flags: needinfo?(arthur.chen)
Eric, not yet. I guess I should get the info from UX designers?
Flags: needinfo?(arthur.chen)
Hi Arthur,
I believe having 3 imput fields and the keypad in the same screen would be really confusing, and there's no way to show errors without hiding a portion of the information if the 3 fields are sitting there. 

So, to avoid this confusion and have a clean process I recommend having the API to verify the PIN.
Flags: needinfo?(vpg)
Assignee: arthur.chen → nobody

Updated

4 years ago
Component: Gaia → Gaia::System
looks like the visuals have been updated for sim pin.  Closing bug..
Status: NEW → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.