As an iPhone X user with an OLED screen, I would like to have an option to have a true black dark mode for its energy saving properties and aesthetics.
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	cmadeo
	Dec 1 2017, 7:50 PM

Description

Link to corresponding Android ticket

https://phabricator.wikimedia.org/T173319

Why are we doing this?

A few iPhone X users with OLED screens have requested a way to have a black dark mode, so that they can benefit from energy saving. Additionally, some iPhone X users have requested this feature for aesthetic reasons, as the bezel around the screen of the iPhone X is a true black. Additionally, this feature will soon be available on Android.

Proposed Design

Changing themes
Users will be able to select black mode from the appearance theme selector in the Article view or in settings.

Color Palette - iOS

Black mode color palette.png (1×899 px, 131 KB)

Element	Black theme color
Base	Base 4- Pitch Black #101418
Paper	Base 0 - Pure Black #000
Mid-background	Base 10 - #222
Chrome	Base 10 - #222

All other elements	As per dark theme

Mocks

Black mode Explore feed	Black mode Article	Black mode Article with reading themes open	Black mode Settings	Theme selection in Settings

Zeplin: http://zpl.io/VDpLWOW	Zeplin: http://zpl.io/bAOLWvq	Zeplin: http://zpl.io/aRmeGNg	Zeplin: http://zpl.io/Vq1NLE7	Zeplin: http://zpl.io/VQMw0X5

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Resolved		JoeWalsh	T181847 As an iPhone X user with an OLED screen, I would like to have an option to have a true black dark mode for its energy saving properties and aesthetics.
		Resolved		Mhurd	T182726 Black mode article view

Event Timeline

cmadeo created this task.Dec 1 2017, 7:50 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptDec 1 2017, 7:50 PM

cmadeo updated the task description. (Show Details)Dec 1 2017, 8:00 PM

cmadeo added projects: Wikipedia-iOS-App-Backlog, iOS-app-v5.7.4-Dachshund-On-An-Elk.

• JMinor triaged this task as Medium priority.Dec 1 2017, 9:33 PM

• JMinor moved this task from Tasks from Product Backlog to Needs Design on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.

• JMinor merged a task: T180760: True black on dark mode.

• JMinor moved this task from Needs Design to Design Doing on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.

• JMinor added a subscriber: ABorbaWMF.

• JMinor moved this task from Needs Triage to Design on the Wikipedia-iOS-App-Backlog board.Dec 4 2017, 7:04 PM

• JMinor edited projects, added Wikipedia-iOS-App-Backlog (Design); removed Wikipedia-iOS-App-Backlog.

cmadeo moved this task from Design Doing to Needs Acceptance Criteria on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.Dec 4 2017, 7:31 PM

cmadeo moved this task from Needs Acceptance Criteria to Design Doing on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.Dec 5 2017, 7:10 PM

cmadeo updated the task description. (Show Details)Dec 7 2017, 12:42 AM

cmadeo moved this task from Design Doing to Ready for Development on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.

• JMinor edited projects, added iOS-app-v5.8.0-Manatee-On-A-Skateboard; removed iOS-app-v5.7.4-Dachshund-On-An-Elk.Dec 12 2017, 7:22 PM

JoeWalsh claimed this task.Dec 12 2017, 7:30 PM

JoeWalsh moved this task from Tasks from Product Backlog to Doing on the iOS-app-v5.8.0-Manatee-On-A-Skateboard board.

Moving back to 5.7.3 per IMs with Joe.

• JMinor moved this task from Ready for Development to Needs Code Review on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.Dec 12 2017, 9:39 PM

cmadeo mentioned this in T182726: Black mode article view .Dec 12 2017, 11:25 PM

@JoeWalsh so far everything is looking good on the native views with Black mode. I have seen two bugs though, one reliably reproducible and the other I only saw once.

The TOC theme seems to be sticking after changing themes. The first theme chosen is then used (only in the TOC) on the subsequent theme choices. It does eventually switch over to another TOC theme, but often this TOC theme is then sticky on other themes. In some cases it appears to be showing the text styling from one theme and the paper color of another theme.

IMG_776DFD4CA8D7-1.jpeg (1×750 px, 249 KB)

Steps to reproduce:
Open article with Sepia theme active
Open TOC
Switch to Black mode
Open TOC

Expected results
Black mode TOC is shown

Actual results
Sepia TOC is shown

On my first load, just the saved tab table view was utilizing the default styling rather than the black mode styling. I have not been able to reproduce this.

cmadeo updated the task description. (Show Details)Dec 14 2017, 9:54 PM

Updated color palette and Zeplin to reflect updates made during paring session with @Mhurd.

cmadeo updated the task description. (Show Details)Dec 14 2017, 10:26 PM

JoeWalsh moved this task from Needs Code Review to Waiting for Build on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.Dec 15 2017, 12:07 PM

JoeWalsh moved this task from Waiting for Build to Needs Design Review on the iOS-app-v5.7.4-Dachshund-On-An-Elk board.Dec 15 2017, 12:10 PM

giphy-downsized (14).gif (200×210 px, 1012 KB)

Looking ready for hardcore nocturnal readers!
Thanks @JoeWalsh!

@JoeWalsh @JMinor @ABorbaWMF TSG doesn't have an iPhone X device so I recommend someone that does test this instead. Thanks!

Tested black mode on a few devices and it is looking good on 5.7.3 (1296).

• JMinor closed this task as Resolved.Jan 8 2018, 10:22 PM

• JMinor awarded a token.

• JMinor closed subtask T182726: Black mode article view as Resolved.Jan 8 2018, 10:33 PM

	F11834114: Black mode color palette.png
	Dec 14 2017, 10:26 PM

	F11834067: Black mode color palette.png
	Dec 14 2017, 10:20 PM

	F11231322: Settings > Reading themes.png
	Dec 7 2017, 12:42 AM

	F11796275: IMG_4755.PNG
	Dec 12 2017, 11:49 PM

	F11796316: IMG_4759.PNG
	Dec 12 2017, 11:49 PM

As an iPhone X user with an OLED screen, I would like to have an option to have a true black dark mode for its energy saving properties and aesthetics. Closed, ResolvedPublicActions