-
-
Notifications
You must be signed in to change notification settings - Fork 12
Addressbar feature icons
As Odysseus becomes more fully-featured, it will need a way to offer page-specific functionality. And for this it requires a UI component which:
- Is within easy reach for those who want this functionality.
- Is unobtrusive for those who do not want the functionality.
- Does not cause a full relayout to happen on each page load (required in order to be unobtrusive).
- Communicates whether the functionality is enabled or not.
- Not be a zone-of-death which any malicious page can imitate, for security reasons.
In order to achieve this icons for each page-feature will be added to the addressbar on the right-hand-side. While page's will have an impact on what is visible here, users must be able to trust the meaning of each icon and what'll happen when they click on it. Page's MUST NOT be able to provide their own icons to this UI component.
The icons will need to be small (16x16 pixels) and precise to communicate clearly whilst not looking busy. And if this means moving away from OS conventions, so be it. It's a fairly self-contained UI component.
As such I will follow iconmonstr.com's style, and probably source many of my icons from there.
The style of the icon will classify these page-features to give some indication of what'll happen when the icon is clicked.
Browser addons will be data files, linked to from a webpage, which Odysseus will use to improve your web browsing.
They'll be represented using thinly outlined icons.
Page permissions will indicate whether a page is allowed to access some data or not.
They'll be represented using thickly outlined icons.
The few icons which don't fall into either of the above categories will use a filled style.
Odysseus will use the colour channel to communicate the status of each page feature, whilst adhearing to elementary's icon theme. This same information will be indicated in a tooltip.
Clicking most page features will toggle whether the feature is allowed to have an impact on something or not. To communicate this status Black 300 (#4d4d4d) will indicate disabled and Blueberry 300 (#64baff) will indicate enabled.
When Odysseus gains support for user scripts/styles and content blockers, these addons will obviously be capable of altering other webpages. To indicate whether this is happening we'll use Orange 300 (#ffa154).
Status icons will use their own colours beyond these to indicate their relevance. Specifically Lime 300 (#9bdb4d) will indicate successful security status and Strawberry 300 (#ed5353) will indicate any errors.
If anyone wants to help design icons specifically for Odysseus, I'll list out all icons I have plans to use here. At the same time I'm (Adrian Cochrane) linking to the icons I'm currently thinking of using, not that that should prevent anyone from improving upon them.
Status: HTTPS secure, HTTPS insecure, local/"incognito" security*, page download failed
Actions: Toggle Reader Mode, install media "codec", import bookmarks, remember password, subscribe to webfeed (or is this a plugin?)
Permissions: notifications, location, camera, microphone, camera+microphone
Addons: vocabularies (A.K.A. tag collections), share link*, search engine, federatable search engine, userstyle, userscript*, content blocker*
* I'm not quite happy with the linked icon.
Browser addons lie further down my personal roadmap. But I plan to implement the rest of them shortly.
And in several cases the functionality is already in Odysseus and these icons will simply allow me to communicate more effectively about them.