Author Archives: lessbloat

lessbloat 7:40 pm on October 23, 2013
Tags: , , , ,   

DASH – 3.8 proposal

Prerequisite: Must have latest version of MP6 installed and activated.
PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party link: https://github.com/growthdesigner/wp-dash

Visual comparison

The existing dashboard (the page you see by default when you log into WordPress) looks like this:

It hasn’t been touched in years, leaving it feeling a tad bloated, and dated. Here’s what the dashboard looks like with our plugin enabled:

What’s changed?

We tackled 5 major areas, and made them each separate includes within our plugin (separate php, js, and css files).

  • We combined “WordPress Blogblog (versus network, site)”, “Other WordPress News”, and “Plugins” to form the new simplified “WordPress News” plugin.
  • We merged “Recent Comments” into the new “Activity” widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user., which now also shows you any scheduled posts and your most recently published posts.
  • We converted “QuickPress” into “Quick Drafts” putting the emphasis more on drafting ideas than publishing, and we merged in “Recent Drafts”.
  • We removed the “Number of columns” screen option. Instead the dashboard is now responsive, and shows the appropriate number of columns based on your screen resolution.
  • The Right Now widget was visually reduced.

Here are a few extras:

  • We removed incoming links (which doesn’t seem to really work anymore).
  • We replaced the “Dashboard” H2 title with a fun group of friendly welcome text and idioms.
  • We added a bunch more hooksHooks In WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. for greater extensibility from any of the dashboard widgets.
  • There’s a fun little smiley if you delete all posts and comments

What problem is your feature pluginFeature Plugin A plugin that was created with the intention of eventually being proposed for inclusion in WordPress Core. See Features as Plugins. trying to solve?

While functional, WordPress’ dashboard page hasn’t kept up with the rest of WordPress. We mean to improve the experience of the first page of WordPress. Streamline it, clean it up looking at all the widgets, and make it responsive.

We’d also love to see future development in the new activity widget, where plugin developers can add more “activity stream” related content.

What other potential solutions did you explore?

If you work backwards through https://make.wordpress.org/ui/tag/dash/ you’ll get a pretty good idea. We met weekly in IRC, and brainstormed/iterated daily via our Skype channel.

Have you done user testing?

Nope, but if this get’s the “all clear”, we’re more than happy to do that.

#3-8, #core-plugins, #dashboard, #feature-plugins, #proposal

lessbloat 1:09 pm on August 13, 2013
Tags: , ,   

I’m doing some quick research into the wp…

I’m doing some quick research into the wp-adminadmin (and super admin) dashboard (which I plan to look at for 3.8). I’d like to learn more about how you use the dashboard, and how you think it could be better. Please take a few moments and fill out this 5 question survey:

Take the survey

Thanks so much for your help!

#3-8, #dashboard, #survey

lessbloat 4:40 pm on February 27, 2013  

Menus Update, 2/27

We’ve all been distracted with other stuff these past 2 weeks. DrewAPicture put together a parent ticket for all of the remaining menu items.

Remaining Tasks

  • Menu items as accordion (@jkudish)
  • Show the menu select area at all times (@DrawAPicture)
  • Additional menus accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) (@lessbloat)
  • Menus help text changes (@DrawAPicture)
  • Test delete link at the bottom (@lessbloat)

I’d like to try and wrap all of these up ASAP.

lessbloat 5:26 pm on February 8, 2013
Tags: ,   

Menus Office Hours (Feb 7)

Here’s a recap of yesterdays office hours.

Work accomplished since last office hours

Major items discussed

1) Theme locations continues to be our biggest design challenge. We discussed a bunch of options and decided to go with checkboxes for theme locations for now – while we continue to stew on alternative approaches.

2) We discussed having settings at the top or the bottom, and settled on them being on the bottom.

On the docket

  • Refactor accordion code (@lessbloat)
  • Re-assess CSSCSS Cascading Style Sheets. in latest patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. (currently 23119.28.1.diff), and move colors to colors.css (Looking for a volunteer here)
  • Browser compat testing (Looking for a volunteer here)
  • No JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. testing (Looking for a volunteer here)
  • Code review (Looking for volunteers here – hopefully from multiple people)
  • Commit what we’ve got

After that

  • Any additional accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) work
  • Additional code refactoring
  • Am I missing anything?

p.s. @DrewAPicture, I added a title this time just for you. 😉

#3-6, #menus

lessbloat 4:41 pm on February 1, 2013
Tags: ,   

We had a great discussion yesterday during office…

We had a great discussion yesterday during office hours. I’m excited to say that we’ve found our direction.

We’ll only be focusing on changes to nav-menus.php for now.

I just posted an updated diff containing some of the ideas we discussed.

Remaining Tasks (already assigned to someone)

  • Test theme locations as checkboxes (@jkudish volunteered to code this up). Note: we decided to leave widgets as checkboxes out.
  • Menu selection dropdown should show location(s) it is used in (@DrewAPicture offered to tackle this)
  • A round of user tests on 23119.23.diff, plus additional testing once “theme locations as checkboxes” and the accordion code is ready
  • Updated copy for help tabs (both manage, and add/edit screen) (@DrewAPicture will oversee this)
  • Updated copy for ​https://codex.wordpress.org/WordPress_Menu_User_Guide (@DrewAPicture will oversee this)
  • Updated copy for ​https://codex.wordpress.org/Appearance_Menus_Screen (@DrewAPicture will oversee this)

Remaining Tasks (still needing a volunteer)

  • Code up menu item boxes as an accordion for us to test (similar in style to customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.).
  • Code reviews (multiple people please :-))
  • RTL testing
  • Browser compatibility testing
  • No JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. testing

Comment below if you’re interested in helping out. Thanks!

#3-6, #menus

lessbloat 2:53 pm on January 29, 2013
Tags: ,   

Menus office hours recap (Jan 28)

We’re still in the process of determining the best direction for menus in 3.6 (mock ups and ideas welcome!).

My hope is that we can stay true to the WordPress Philosophy by optimizing the experience for the majority of users, and leaving edge cases for plugins to handle.

One issue at this stage is that I can only guess as to what the majority looks like. I’m going to attempt to gather some data from WordPress.comWordPress.com An online implementation of WordPress code that lets you immediately access a new WordPress environment to publish your content. WordPress.com is a private company owned by Automattic that hosts the largest multisite in the world. This is arguably the best place to start blogging if you have never touched WordPress before. https://wordpress.com/ as to how many users have one menu vs. more than one vs. none. This should give us some additional insight into the best way to approach menus.

For this weeks meeting my goal was to list out, and then (roughly) prioritize the biggest pain points associated with menus. Since I have little data at this point, this prioritization is based on the assumption that the vast majority of users have either no menus or one menu.

Here’s how I prioritized things, please weigh in if you disagree:

  • One of the biggest disconnects I’ve seen is the concept of “theme locations”. Adding a menu, and then assigning it to a theme location seems broken.
  • Trying to have menu management + editing + theme location assignment all on the same page is overwhelming.
  • Tabs don’t work for users with lots of menus to manage, and they confuse some users (who think they represent menu items within a single menu). Side note: when we tested menu management via a drop down (instead of tabs), users didn’t notice the drop down, and wondered where the menus they had already created were. A “manage menus” tab appears to work for users, but it seems heavy for users with just a single menu.
  • Switching themes poses a problem for menus in that there is no concept of a base menu. Every theme determines their own default menu, and even though two menus may have a single primary menu, you still have to re-assign your menu to that theme location whenever you switch a theme.
  • Users have a hard time visualizing how the menu changes they are making actually impact their blogblog (versus network, site)/site.
  • Having to scroll to see all of the menu item metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. boxes in the left column can be annoying, and it can make discoverability for items below the fold harder.
  • If you have a long menu (with lot’s of menu items), you may be scrolling unreasonably down from the left to the right column.
  • The fact that you can add menus to a custom menu widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. is not exposed anywhere.

Did I miss anything?

#3-6, #menus

lessbloat 7:12 pm on January 23, 2013
Tags: ,   

For tomorrows Menu office hours I only…

For tomorrows “Menu” office hours I only have one agenda item: To figure out where we’re headed with menus in 3.6.

Continue reading →

#3-6, #menus

lessbloat 1:13 pm on January 21, 2013
Tags: ,   

Menus discussion today

I’d like to hold our first menus IRCIRC Internet Relay Chat, a network where users can have conversations online. IRC channels are used widely by open source projects, and by WordPress. The primary WordPress channels are #wordpress and #wordpress-dev, on irc.freenode.net. discussion today at 21:00 UTC (4:00pm EST, 1:00pm PST) in #wordpress-dev.

Here’s a reminder of more or less where we’re at: https://make.wordpress.org/core/2013/01/16/heres-a-quick-update-on-the-3-6-menu/

In addition to talking about the feature, we’ll figure out a good time to hold all other bi-weekly meetings. Thanks!

#3-6, #menus

lessbloat 8:32 pm on January 16, 2013
Tags: ,   

Here’s a quick update on the 3.6 menu…

Here’s a quick update on the 3.6 menu changes we’ve been making:

Last week we:

  • Merged the the UIUI User interface into two screens. Now we have manage menus & add/edit menus.
  • Tested this new two screen approach. Â It went really well (we put two users through – videos are on the Make/UI P2P2 A free theme for WordPress, known for front-end posting, used by WordPress for development updates and project management. See our main development blog and other workgroup blogs.).
  • Improved & simplified some copy
  • Added a new hookable “common links” metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. box with “home” and “Log in” as the default links (both of which are fairly confusing to try and add to a menu otherwise).
  • Added keyboard accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) for rearranging menu items

What’s left:

CODE

  • Break this out into two separate files 1) manage 2) add/edit (@jkudish is on this)
  • Code review everything (@jkudish volunteered)

DOCS

  • Updated copy for help tabs (both manage, and add/edit screen) (@DrewAPicture volunteered)
  • Updated copy for https://codex.wordpress.org/WordPress_Menu_User_Guide (@DrewAPicture volunteered)
  • Updated copy for https://codex.wordpress.org/Appearance_Menus_Screen (@DrewAPicture volunteered)

TESTING

  • Once the code items are complete, I’ll run another round of user tests (@lessbloat)
  • RTL testing
  • Browser compatibility testing
  • No JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. testing

If you’ve got some time, we’d love your help with testing the latest patch.

Lastly:

I’d love to hear all of your thoughts, concerns, criticisms. 🙂

#3-6, #menus