[DAO:f555c68] Darkmode for DAO & Forum

by 0x059d0025e4e1bb1a37f2c922e54b139bc1231ee0 (LayDeez)

Linked Draft Proposal

Darkmode for DAO & Forum

Summary

The idea behind dark mode is that it reduces the light emitted by device screens while maintaining the minimum colour contrast ratios required for readability

Abstract

Dark mode is a design feature that displays a website or application’s user interface using dark colors instead of light colors. It is often motivated by a desire to improve readability and reduce strain on the eyes, as well as to extend battery life on devices with OLED or AMOLED displays. Implementing dark mode on a website or application can also improve accessibility for users with certain visual impairments, as it provides higher contrast between text and the background. Ultimately, the decision to implement dark mode on a website or application should be based on the needs and preferences of the users.

Motivation

Improved readability: Dark mode can improve readability for users who are sensitive to bright or white screens, as it reduces the strain on the eyes. This is especially important for users who spend long periods of time reading or working on a computer.

Increased battery life: Dark mode can also help extend battery life on devices with OLED or AMOLED displays, as these displays use less power to display darker pixels. This can be especially important for users who rely on their devices for long periods of time and do not have access to a power source.

Improved accessibility: Dark mode can also improve accessibility for users with certain visual impairments, as it provides higher contrast between text and the background. This can make it easier for these users to read and navigate the website or application.

Specification

Create styles for dark mode: Define the styles for your dark mode in your CSS file or include them in a style tag on your HTML page. These styles should specify the colors and fonts that you want to use for the dark mode version of your website or application.

Add a toggle button: Add a toggle button to your website or application’s user interface that allows users to switch between dark and light mode. You can use HTML, CSS, and JavaScript to create this toggle button and add it to your site or application.

Add JavaScript to toggle the modes: Use JavaScript to create a function that toggles the dark-mode class on the body element of the page when the toggle button is clicked. You can also use JavaScript to store the user’s preference for dark or light mode in a cookie or local storage, so that the preference is remembered when the user returns to the site or application.

Test the implementation: Test your dark mode implementation on different devices and browsers to ensure that it is working as expected and that the styles are applied correctly. Make any necessary adjustments to the styles or JavaScript code as needed.

Impacts

Implementing dark mode on a website or application can have a number of potential impacts, both positive and negative. Here is a detailed assessment of some of the potential impacts of implementing dark mode, based on the motivations and specifications described above:

Positive impacts:

Improved readability: Dark mode can improve readability for users who are sensitive to bright or white screens, reducing strain on the eyes and improving the overall user experience.
Increased battery life: Dark mode can help extend battery life on devices with OLED or AMOLED displays, which can be especially useful for users who rely on their devices for long periods of time and do not have access to a power source.
Improved accessibility: Dark mode can improve accessibility for users with certain visual impairments, as it provides higher contrast between text and the background. This can make it easier for these users to read and navigate the website or application.
Negative impacts:

Decreased visibility: Dark mode can decrease visibility for users with certain visual impairments, as it reduces the contrast between text and the background. This can make it more difficult for these users to read and navigate the website or application.
Increased cognitive load: Dark mode can increase cognitive load for some users, as it requires more mental effort to process and read the text and graphics on the screen. This can be especially true for users who are not accustomed to using dark mode and may take some time to adjust to it.
Decreased legibility: Dark mode can also decrease legibility for some users, especially if the font and background colors are not chosen carefully. This can make it more difficult for users to read and understand the content on the website or application.
In summary, implementing dark mode on a website or application can have both positive and negative impacts depending on the needs and preferences of the users. It is important to carefully consider these potential impacts and test the implementation thoroughly to ensure that it is working as intended and providing the desired benefits.

Implementation Pathways

To implement dark mode on a website or application, the following concrete steps can be taken:

Consult with community members: Consult with community members, including users and developers, to understand their needs and preferences with regard to dark mode. This can be done through surveys, focus groups, or other forms of consultation.

Define the styles for dark mode: Define the styles for your dark mode in your CSS file or include them in a style tag on your HTML page. These styles should specify the colors and fonts that you want to use for the dark mode version of your website or application.

Add a toggle button: Add a toggle button to your website or application’s user interface that allows users to switch between dark and light mode. You can use HTML, CSS, and JavaScript to create this toggle button and add it to your site or application.

Add JavaScript to toggle the modes: Use JavaScript to create a function that toggles the dark-mode class on the body element of the page when the toggle button is clicked. You can also use JavaScript to store the user’s preference for dark or light mode in a cookie or local storage, so that the preference is remembered when the user returns to the site or application.

Test the implementation: Test your dark

Conclusion

In conclusion, dark mode is a popular design feature that can improve readability, extend battery life, and improve accessibility for some users. However, it can also decrease visibility, increase cognitive load, and decrease legibility for other users. Implementing dark mode on a website or application involves defining the styles for dark mode, adding a toggle button, adding JavaScript to toggle the modes, and testing the implementation. It is important to consult with community members, including users and developers, to understand their needs and preferences with regard to dark mode, and to carefully consider the potential impacts of the implementation. By following these steps, you can successfully implement dark mode on your website or application and improve the overall user experience.

Vote on this proposal on the Decentraland DAO

View this proposal on Snapshot

1 Like

please Yes on this. 100% yes. my eyes hurt so much i starting to only see stars and waifu jpgs. I also always have Decentraland on Night mode even during the day. So will be great ton finally have here as well. Thanks.

1 Like

Governance proposals should not be used for these kind of menial decisions. I hope this doesn’t get quorum.

As I mentioned in the draft: it’s not clear that Dark Mode is beneficial:

Dark mode can be enabled in any website with an extension:

1 Like

Thank you for your valuable input.

So, you don’t like if community wants to be a part of decisions for the website?

Let the community decide on this, this is what a proposal is here for…decentralized

5 Likes

What about the decentralization, is there a chrome plugin for this?

Like @ArtReYou said - Let the community decide.

5 Likes

https://www.nngroup.com/articles/dark-mode/

2 Likes

Hey @esteban isn’t it the Foundations job to give the community what we want?

We want Dark Mode.

Most websites have this simple feature, why cant we?

4 Likes

its all fun and games until you install the wrong extension and it steals all your info.

5 Likes

This is a waste of time and resources. DCL Worlds is going to be more important. We need to focus our time more on researching how we can get the worlds to more users. That’s where our resources should go.

1 Like

I hope this reaches quorum🤪

2 Likes

IDK, ask someone from the Foundation. Also, it’s my understanding that “Governance Proposals” have nothing to do with the Foundation.

It would be awesome if we stop abusing the governance mechanism, and instead try to fix things ourselves by collaborating on the open source code: GitHub - decentraland/governance: 🏢 Governance platform of the Decentraland DAO.

If you can’t code, and you (all of you who “want Dark mode”) don’t feel like commissioning the work for your benefit and that of others, I can say that in my experience the awesome team at the Governance Squad have been quite cool and responsive with improving the website based on feedback left there.

Agreed, 100%.

In general, I hope that frontends become easier to customize with the advent of AI tooling. There are also other more secure ways, like user stylesheets if you use firefox (How to Add a User Stylesheet in Firefox)

2 Likes

I am strongly against the use of this governance mechanism to request a particular feature to be implemented. I think I made it clear. I myself use the forum in dark mode (you can activate it in preferences) and I would like to have dark mode in not just the governance app but many others.

I don’t like your accusation, and I would prefer it if you could pursue other means to make this change rather than “asking the Foundation” to do something (although I don’t think “Governance Proposals” have anything to do with the Foundation). I understand that you might have taken my comment “I wish this doesn’t get quorum” a little personally, and I could have been more polite, but I honestly think this is not the best way to improve Decentraland.

For example, as @TheCryptoTengu mentions, it’s not generally safe to use extensions (I only use a few, and have other security mechanisms in place to avoid problems), and maybe I shouldn’t have proposed the use of one, without clarifying that I did so because I have used it in the past and I can at least confirm that it doesn’t trigger strange outbound connections, and it’s open source.

Edit:

You’re welcome! Thanks for valuing it :slight_smile:

3 Likes

I wanted to bring up something I didn’t mention earlier. Since I have been using ChatGPT, I noticed that this text may have been copied and pasted from ChatGPT responses. There’s nothing wrong with that, but it’s important to filter and review the text carefully before publishing it. Otherwise, it can be a burden for those who take the time to review it.

In order to benefit the rest of the community, it’s important to take the time to carefully review and edit it to ensure that it is accurate and/or free of errors such as this one:

1 Like

Thank you for your response and the detailed explanation.
I understand your point. May you have something official in the docs you can share with us here?

May i can deal something out with you: Im gonna delete this Governance Proposal and you gonna build us a opensource Beer Pong Game (with Leaderboard) for the DCL Community:

And im also gonna delete this :slight_smile: How you like my idea?

I also admit that the Dark Mode Proposal was fully written with ChatGPT.

Best reagards

No need to! It might not reach quorum, and in such case there’s no harm done. I also think this was a great exercise in collectively making this a better tool and understanding! And again, I apologize for not being polite with my first response :slight_smile:

Sorry, my coding skills are a little rusty :frowning: but happy to support it under the new tender&bid framework.

3 Likes

LOL Epic answer “IDK, ask someone from the foundation” this is really important knowledge

The LORE that i have been hearing buzzing around is that Esteban is “BACK”, could you tell me if that means Back working with Foundation or just back for a good time :sweat_smile:.

asking for my personal knowledge ^.^

Credit to fren for showing me this amazing use of the word LORE xD

1 Like

I don’t have a formal position yet

2 Likes

No need to apologize but i appreciate it, thank you - all good :smiley:

Happy to learn something and try to help ot make this space a better place for us all.

1 Like

Welcome back to the Shenanigans @esteban

1 Like

I would like dark mode but I don’t think this is the spot for those kind of requests. I think there is a suggestion/feedback channel in discord that we have been using to suggest features. Also don’t think it’s a priority as far as proposals go.