Tag Archives: fse-hallway-hangout

annezazu 7:42 pm on October 26, 2022
Tags: fse-hallway-hangout   

Hallway Hangout: Discussion on wrapping Phase 2 (26 Oct)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance: Rich Tabor, Damon Cook, Courtney Roberston, Paal Joachim Romdahl, Jeff Ong, Nick Diego, Vagelis, Sé Reed, Piermario Orecchioni. 

Video Recording:

Topics:

The main topic centered around the work underway to wrap phase 2 gathered in this overview issue. Expect regular updates to this issue and know that other work will continue but there’s a big emphasis to complete the tasks outlined there. 

As of last week, the following was in place:  

  • Work has been completed (1)
  • Dev work is underway (9)
  • We’re in the design stage still (3).
  • Dev is assigned but hasn’t started (3).
  • Means work is stuck but there’s follow up to try to get unstuck (1).
  • Means work is stuck, either due to a problem or a time lapse of 14+ days, and unclear how to unblock (11).

From there, we dug into the following individual issues to chat through at a high level what we were seeing. At a high level, it stuck out to folks how many different explorations there are, conflicting designs at times, etc. By doing this work concurrently, these differences can be resolved and the solutions refined together. 

Introduce “Browser” and surface main navigation UI. 

We talked about how this was a change in the entrance to the site editor just as much as it was for navigating between content. There was a desire to be able to click on the site title in the nav component to take you to the front end of the site. We discussed the important of 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) testing for this change and it’s top of mind to test for the FSE Outreach Program. 

Global styles: Offer a way to view a document containing all blocks and styles

  • Overall, this would be a great way to get a sense of how changes impact the entirety of the site and in creating a more unified approach. 
  • When looking at this issue, various folks commented on how it feels like there’s a number of different modes and it isn’t always clear how they relate and don’t relate. Part of this is due to designs being in progress at various stages and including some work but not others. 
  • We chatted about how the IA needs to improve around right/left sidebars. Is there a best practice for when to put things in left vs right sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. in the design library? Are we at a critical point in that convo right now? What about RTL when it comes to moving where things “live”? 

Make it possible to push local block styles to global block styles

  • This was noted as something that’s likely for more advanced folks but still very handy.
  • There are some tricky things to figure out since the styles pushed would have to be supported within GS.
  • It also requires a site to be built in a certain way to work since there’s some complexity around the specificity of global styles. 

Using the template editor for plugins

  • We talked about plugins using the template editor (example from Woo) and how the template editor doesn’t have access to global styles, leading to viewing Consider exposing the Styles UI for classic themes using theme.json.
  • We discussed what consolidation of the various editors might look like and how the current work seeks to make everything more unified, with the option to edit content in the site editor for example. 

Media library getting the “FSE treatment”

Feedback on the Quick Inserter prioritizing patterns in certain circumstances 

  • We discussed some pain points around when the quick inserter prioritizes patterns, especially the struggle to be able to add a blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.!
  • Talked about having it be a user preference to start with blocks vs patterns. 
  • There are generally two different mindsets when working with blocks vs patterns. 
  • Could the slash inserter work with patterns? There’s already an open issue here. 

Other topics and questions

Folks shared that responsiveness is still a big topic along with navigation block. Multiple people echoed both. Damon shared in the chat: “The Navigation block has SO much complexity, but tackling the challenges will likely surface many great ideas that can be rolled out to other blocks that have complete UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing./interaction”. Finally, we chatted at the end about the history of the Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block naming (why not loop?), where folks can report issues when 6.1 is out in the wild, and what’s next for the FSE Outreach Program.

#fse-hallway-hangout

annezazu 10:02 pm on August 25, 2022
Tags: fse-hallway-hangout   

Hallway Hangout: Discussion on Block Themes (25 Aug)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance: Carolina Nymark, Daisy Olsen, Manuel Esposito, Rich Tabor, Herb Miller, Ellen Baeur, Ana Segota, Evan Mullins, Damon Cook, David Bowman, Jessica Lyschik, Ed Beck, Courtney Roberston, Amy L, Rita Best.

Video Recording:

Topics:

Apologies for the lack of timestamps – this conversation was vast and deep, making it hard to separate out into specific sections.

  • Pain points with blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. themes, including naming conventions for color palettes/mapping colors, managing updates to the theme, oddities with switching between style variations/losing styles, and keeping up with all the various changes to CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress..
  • Pain points from users including “how can I change fonts”, using the navigation block, and confusion around the split between the post editor vs site editor (ie have to go into the site editor to manage styles).
  • Theme switching and the UXUX UX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it. around picking/choosing parts of Styles from a theme, which ties into this prior exploration.
  • Discussion around “Who are our users?” and how there’s a spectrum of use cases to cover from those who want a ready made theme to those who want to dig into the details. How do you build for each or all?
  • Discussion around having a pattern library/pool as a way to speed up development for themes with a note around how there are so many ways to build smarter for block themes and how much more accessible it is for designers compared to classic themes.
  • Discussion around using Figma and design tokens to create a system for updating/working with theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.. The following links were shared: Figma Tokens & Style Dictionary (What’s used to transform the output for theme.json). This is currently being used by the VIP team at Automattic.
  • Discussion around custom blocks, when to build them, and why they are often times preferable due to the ability to completely manage updates rather than chasing after changes to Core. This led to a conversation around why themes aren’t able to require custom blocks (it breaks a users site when they switch away).
  • A follow up idea was shared after the hangout from Damon Cook to consider: “It would be super helpful to have a single Figma file with all blocks, colors, and properties that could go in a theme.json. It would undoubtedly be high maintenance and would have to be under active updates alongside new GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ features being merged into core, but it could also have a webpage equivalent to markup/output. A WordPress theme Style Guide: Figma file with the equivalent of block output on a site for users to copy/paste the code into their theme and see everything on a page… kinda deal.”

Overall, while there is both excitement and interest in what block themes unlock, it’s also clear that there are a build up of pain points to address, whether through clearer resources or changes to Gutenberg itself. These conversations are just one way to start surfacing these themes (get it) and to begin finding ways forward.

#fse-hallway-hangout

annezazu 6:23 pm on June 30, 2022
Tags: fse-hallway-hangout,   

Hallway Hangout: Discussion on Full Site Editing visions and plans (30 June)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance:

@elmastudio @fabiankaegy @annezazu Lisa Synder @beckej @oglekler

Video Recording:

Topics

We mainly talked through the following different posts that help show both the complex problems at hand and potential thoughts around how to approach solutions:

Throughout the conversation, we had mini dives into various topics, including talking about comparing patterns, template parts, and reusable blocks. We also discussed how there are various layers in which to approach this work from the end user level to the deeper technical considerations. The hope throughout it all is to make these more complex and detailed explorations more understandable and engaging.

#fse-hallway-hangout, #fse-outreach-program

annezazu 1:05 am on June 2, 2022
Tags: fse-hallway-hangout, ,   

Hallway Hangout: Discussion on Full Site Editing Issues/PRs/Designs (1 June)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance:

@ndiego @annezazu @elmastudio and a Marcy joined us for a time.

Video Recording:

Topics

Briefly touched on two recent blog posts to be aware of:

Block Font Sizes and Fluid typography
High Level Feedback from the FSE Outreach Program (May 2022)

What’s missing and what’s stopping people from switching to blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. themes

  • Responsiveness continues to come up with Ellen sharing how she built their own system to handle this for now, knowing that they can always switch over. She believes this is one of the main reasons people are holding back from switching to block themes.
  • We chatted briefly through intrinsic responsiveness ideas related to this and how that’ll ease much of these tensions in time.
  • Onboarding to the FSE experience was brought up, particularly around how confusing it is that the BetaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. label still exists since that seems to imply it’s not usable. There’s an open discussion around removing the beta label (in time) on this exact topic.
  • The question came up around “How do we get folks to use block themes if there’s a beta label?” and how difficult that can be.
  • @poena has a post on switching over to a block theme, Ellen is working on a post for a 10 step process, and there are clear areas that can be improved to ease this process from a technical point of view in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. (see “Ease switching to a block theme/between block themes” in this post).
  • People are very confused about when to switch in general though, even if folks like Ellen are building things that are ready to go for production sites.

Communicating the value of FSE

  • Nick has done some hardcore testing with folks who are new to the site editor and when watching them go into the experience and they change the typography of paragraphs but then can’t with headings! Why? We need to take a look at consistency across the tools we’re providing people. People get very frustrated and confused when one block has controls and another doesn’t. 
  • Block themes truly is a better experience for getting a design into WordPress but the confusion added is a bit sad for the project that it gets a rough reputation.
  • Right now, it feels like more of a communication issue to the end user around what they should actually do and what they can do with consistent communication. Figma does this well.
  • This has come up in DevRel for WP Engine. When you’re talking about the basics of how to do XYZ, this should be on Learn and in docs. When you’re talking about the cool, cutting edge stuff, we need more of that. “Here’s how to learn the basics of creating a block theme but here’s how to take it to the next level.” 
  • We discussed how if we can standardize block settings across all core blocks but allow agencies to turn on/off easily that’ll be huge for the user experience.

Patterns and opening up tooling

  • We spent some time chatting about issues for unifying the pattern modals and patterns as sections work since having consistency in the interfaces for patterns and in the larger editor can really help folks take advantage of what’s possible.
  • In many ways, it feels like users can rely on patterns and/or learn by doing over time as they explore more tools. As a result, exposing those tools doesn’t feel as risky as a pattern can guide the experience and, if they do want to dive in more, they can have access to the tools outright.
  • We discussed how valuable locking is when it comes to patterns as a way to curate and guide the experience more.
  • We went back and forth on the question of “How do we get people excited about what’s possible rather than worrying about folks breaking things?”

Difficulty with terminology

Naming of bock themes and the theme directory

  • We talked about how there have been different names for block themes, like “full site editing theme” or “block-based theme”. This is causing confusion and also differs from what shows up in the Theme Directory.
  • We discussed how difficult it is to find block themes in the directory since the tag you have to use is “full site editing” , which both isn’t intuitive and hard to find.
  • This led to questions around having a separate menu item for themes or improving the filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output..
  • Ellen shared how it’s unattractive to put free themes in the directory – “who clicks on FSE to filter?” Discoverability is so low – it’s not featured enough. She shared that they don’t put any effort into free themes. 
  • We all felt that the entire theme directory was due for an overhaul but were curious about what some quick solutions could be for now to make it more attractive and interesting to add block themes there.
  • Perhaps there could be a block label in the section below:
Image of the theme directory filtering showing the number of themes, a popular, latest, and feature filter label.

Limitations of the pattern directory

  • In talking about the theme directory, we discussed how neat it would be to find patterns associated with different themes, partially as a way to entice people to download that specific block theme and improve the user experience.
  • Ellen brought up how it’s not possible to add patterns to the pattern directory that use third party blocks. This sometimes prevents submissions for block themes who have specific blocks for their theme. 
  • We discussed how the pattern directory is overwhelming for users yet also limited: you can’t use named variables for color palette + can’t use third party blocks + no curation. 
  • The crux of the problem is t hat block themers are creating blocks to fill gaps with core right now which then limits what can be added to the pattern directory.
  • We discussed how there perhaps could be a filter to allow for third party blocks vs Core blocks. For those who want to venture into needing third party blocks, they could then opt in by filtering to show those.
  • @shaunandrews recently shared a post about 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 dependencies so some of that thought/design could likely be re-used there.
  • Nick shared how for the new feature in 6.0 where block themes can feature specific patterns from the directory, it’s still not granular enough. It would be nice to be ale to disable all patterns but then bring in a few from the directory to feature. There’s an issue open for this topic already!
  • We ended the call talking about how these dynamics often fragment the community  – people building premium themes or patterns rather than using the Core pathways. This then moves everything away from Core distribution channels and harms the community/branding/experience of WP.
  • Ellen described it as feeling like you’re building against something.
  • We ended the call talking about how important it is to share feedback, engage in discussions, and help influence the direction of where things go so we can get to where we need to.

#fse-hallway-hangout, #fse-outreach-experiment, #fse-outreach-program

annezazu 5:53 pm on May 25, 2022
Tags: fse-hallway-hangout,   

Hallway Hangout: Discussion on Full Site Editing Issues/PRs/Designs (25 May)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. Thank you to everyone who joined in!

Attendance:

@ndiego @karmatosed @shaunandrews @beckej @fabiankaegy @dhansondesigns @codemanas Colin Duwe

Video Recording:

Topics

Style variations

  • Started off checking in on the new Global styles ongoing roadmap overview issue.
  • Ed discussed how he wishes there were options to pick and choose only certain parts of style variations rather than whole variation.
  • In order for that to be an option, there needs to be a combination of improvements/changes including more granularity with saving, the ability to partially switch styles, and exposing more style options. This is somewhat touched on here.
  • Overall, the resounding question was “How can we make it less overwhelming for users?” especially if they might want to take advantage of aspects of the style variations without switching entirely.
  • Right now, there are two extremes without much ease for middle ground options: all the options to customize in Styles vs wholesale full switching between styles (with variations). 
  • What could we offer for theme developers? If we can extend this for themers, they can manage more granular options for their users rather than CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. 

How can we curate the experience? 

  • Colin brought up a very important topic around curating the experience for folks, especially clients. He asked whether there was an issue that summarized the various approaches being taken (there is not and I followed up after around perhaps creating a Discussion issue).
  • This led to a conversation around various curation options through theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML., template locking, and blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. locking, including being able to control who can do block locking with filters.
  • The question of “How can you build a theme and lock things down/curate for clients?” at the same time came up.
  • For example, clients need to be able to edit the navigation menuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site. and headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. but don’t touch the logo on the left! You could lock various items down to ensure things aren’t deleted. 
  • In general, there was agreement that the power lies between theme.json and locking options. 
  • During this conversation, a few folks from the agency world mentioned how theme.json is only useful if it works in tooling for existing agencies and design systems. For example, people are struggling a bit switching to theme.json from CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site.. 
  • While, in time, folks should be able to rely on the site editor to build a theme, it’s a big workflow change regardless and not everyone is going to build from there. This is where the power of import/export functionality will be key.
  • Trying to push towards doing these things in theme.json but the amount of uncertainty around even just simply adding a theme.json feels nerve wracking. 

Explore options for standardizing and extending theme.json design tokens for spacing

  • We touched on the desire to standardize spacing options and have the same t-shirt sizing/spacing scale that is being done with typography controls. This will help guide the user while also give them flexibility to choose from some presets.
  • By having standardization, it’ll be easier to have content portability/theme switching/etc.
  • This conversation led to a discussion around how inconsistent the dimension controls are across blocks. It’s hard to know why one option is available in X block but not Y. There’s a sense they should all be available.

Split block tools between “settings” and “appearance” 

  • The initial reaction from two folks was “Ahhh two sets of tabs!” when first seeing some of the designs.
  • When thinking about the various tools, this brought up the question of “What’s a primary or secondary tool for each block?”. It seems wise for an audit of some sort to occur.
  • These pain points relate to both blocks not all having the same controls + understanding what’s in block toolbar vs sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme..
  • For folks in the agency world, there’s also an element of how different people need to look at each set of tooling (visual vs content focus) depending on what they are doing (are they a designer or a copy person?).
  • Keynote was shared as an example of an application that manages this experience quite well.
  • We went through the Query loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block as an example of current pain points.

Rows/stacks/group: variations or new blocks?!

  • Right now, the transformation is in sidebar rather than transform menu. There’s an issue open to add the variations to the transform menu.
  • We briefly talked about when does it make sense to have as a standalone block with different controls being exposed rather than variations that comes with inherent limitations? 

New Blocks Adoption label

  • We ended by briefly touching on a new label for items that block adoption for these features.
  • If folks have any they want with that label, please do just let me know and I can add it in!

#fse-hallway-hangout, #fse-outreach-program

annezazu 7:49 pm on February 16, 2022
Tags: fse-hallway-hangout,   

Hallway Hangout: All Things Media

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. All were welcome! The intent was to chat about whatever was on folks’ minds as 5.9 is around the corner. Thank you to all who joined.

Attendance: @fcoveram, @annezazu, @bobbingwide @pdclark, @beckej, @paulbigai, @ndiego, @piermario, @paaljoachim, @courane01

Video Recording:

Topics Covered:

  • We kicked off the call talking about a few specific issues and use cases, like copying/pasting an image into an image blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. and being prompted to name an image upon pasting. I couldn’t replicate an issue here after the call but am following up via DM.
  • We dug into rethinking the role of a featured imageFeatured image A featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. in a full site editing world, including looking at a few designs.
  • We chatted about the overall pain pointPain point Pain points are “places where you know from research or analytics that users are currently getting hung up and have to ask questions, or are likely to abandon the site or app.” — Design for Real Life and desire for better media management (folders, rename files, etc). With FSE, things that used to be locked away are increasingly getting easier to work with to the point that there’s a feeling of wanting to be able to do everything.
  • We chatted briefly about how Openverse could integrate with the pattern directory and how the media library might be able to integrate with media related patterns. Overall, it feels really high impact to have your own images or an image you’re looking to use baked into a pattern you want to use as well.
  • We talked about how switching themes causes featured image changes in terms of sizing/cropping, which can be a bit annoying to have to refine and an extra step when switching themes.
  • The topic of uploading an image to the photo directory from one’s media library came up as it involves a few steps from how to connect to a WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ profile to a potential way to see all your content in Openverse to how to connect multiple sites to the same profile and more.
  • @beckej was kind enough to share his screen to show off how he uses the Pressbooks 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, which includes attributions in the media library. Since this is already a WordPress solution, it’s great to see how it’s being built and what it might look like. We talked about how perhaps it’s up to the author to choose from a few different style options depending on how they are using an image. Ideally, attributions can also match the theme style so that, upon adding an image, it immediately fits in.
  • We dove into what other tools do well (or poorly) that should be considered as part of WordPress’ media feature. This led to discussing how other services have paid connections (like squarespace) so don’t  have to worry about things like attributions, which inherently makes the job WordPress has a bit harder.
  • The topic of attributions led to talking about how can we make attributions “cool”/the norm? Similar trends have come up with offering captions on videos on social media, an increasing number of folks sharing “props to @xyz profile”, and more folks paying attention to alt text.
  • @paaljoachim shared a previous Google doc of a few screenshots from other services.
  • As the photo directory grows, the question of how we can improve adding alt text to images came up as right now the description field doesn’t nudge things along too much.
  • We discussed how we can do things like show how an image is displayed elsewhere as a way to recognize content creators. Some folks might also not want to use a heavily used image and might purposefully seek out less used ones to have more individuality on their site.
  • We talked through how important that very first moment of using Openverse will be in terms of ease of use and how the attribution flowFlow Flow is the path of screens and interactions taken to accomplish a task. It’s an experience vector. Flow is also a feeling. It’s being unselfconscious and in the zone. Flow is what happens when difficulties are removed and you are freed to pursue an activity without forming intentions. You just do it.
    Flow is the actual user experience, in many ways. If you like, you can think of flow as a really comprehensive set of user stories. When you think about user flow, you’re thinking about exactly how a user will perform the tasks allowed by your product.Flow and Context
     works. If it’s magical and does things like matching the theme styles, it could really help with adoption.
  • We ended the call agreeing that the ability to disable Openverse integration will also be important. This has come up with the pattern directory too and feels standard at this point to have this kind of opt in optionality.
  • At some point during the call, Ed also shared a great example of attributions on a site where, at the bottom, there’s a drawer that expands and shows all attributions there. It’s great to see specific examples and how they are being solved as this might influence how something like a gallery might work.

I love the idea of pulling the first image as the featured image if there is no featured image. My role is I work in SUNY, working with students, and that’s something they always forget to do.

@beckej in the comments of the call.

#fse-hallway-hangout, #fse-outreach-program

annezazu 1:46 am on January 21, 2022
Tags: fse-hallway-hangout,   

Hallway Hangout: Let’s talk about WordPress 5.9

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. All were welcome! The intent was to chat about whatever was on folks’ minds as 5.9 is around the corner. Thank you to all who joined.

Attendance: @elmastudio @ndiego @jeffpaul @rbest @megphillips91 @marybaum @piermario @bobbingwide

Video Recording:

Topics Covered:

  • We kicked off the call chatting about Page Builders and what folks might be expecting from WordPress 5.9. Specifically, there’s a sense that folks want to be able to do all of their favorite things from page builders in FSE. In reality, CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. is meant to provide a shared base all can build upon (include page builders) and extend as needed, including finding a 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 that offers a more curated experience.
  • We chatted then about contextual patterns, meaning patterns being shown right when you need them, and the impact of the pattern directory to help folks build content quickly. Not everyone will want t use the pattern directory though so it’s likely this responsibility with fall to blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. themers or site builders to package things for users.
  • We jumped into a wonderful discussion on the impact of names and how confusing some of the names are. @ndiego went through a few names of plugins using the word “template” to highlight some of the current confusion.
  • This launched into a conversation about how eventually this is where the UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. can play a role in not needing to know the names of things. Folks shouldn’t need to think “I want to add a template part here” but should instead only be presented with certain options.
  • This led to a conversation about the role and needs of early adopters! There’s a very real need for “descriptive, understandable, intuitive, and consistent language” (to quote @megphillips91) that we can all then use to educate others. Made a plug to share anything in this Glossary that might need to be updated since the outreach program can help there.
  • We briefly touched on some current pain points in the editor right now, like how we tell folks to “edit their site” yet it’s just called the Editor under Appearance. We also went through a few different ways the UI can help including colorizing various pieces and the power of locking.
  • We ended on a sneak peak at next call for testing! It’ll focus on the experience of media when building a site.

#fse-hallway-hangout, #fse-outreach-program

annezazu 4:47 pm on December 21, 2021
Tags: fse-hallway-hangout,   

Hallway Hangout: Let’s talk about WordPress 6.0

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. The intent was to have a fun and open ended chat about what we each would like to see for WordPress 6.0 as 5.9 continues to take shape. This was not a call to make decisions or set priorities as a result but just to swap ideas, review various issues, and more. Overall, this chat really showed how the foundation being set for 5.9 is leading to great excitement about future WordPress releases and the features that might come.

As a friendly reminder, please help test WordPress 5.9.

Attendance: Thanks so much to everyone who took the time to join. It was so neat to see folks before the year ends. cc @poena @fabiankaegy @overclokk @courane01 @anoopd @thakurtech @annezazu @azhiyadev

Video Recording:

Topics Covered:

  • We started the call talking about responsive controls after @thakurtech shared some great insights around the current experience with clients missing the ability to have more options, specifically with the columns blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.. This overview issue was identified as a great place to share this kind of feedback.
  • A lovely and well deserved shoutout was giving to @poena about all of her excellent work with https://fullsiteediting.com/.
  • Keeping up with WooCommerce changes related to FSE were mentioned with the best advice being to check out the WooCommerce GitHub repo and reviewing their latest changelogs.
  • We briefly chatted about the Comments Loop block and excitement for more robust comment abilities for 6.0, including integrated patterns.
  • The current experience of the Layout settings were brought up as an area that refinement and iteration is needed, from how it’s currently named/described to how to make it easier for folks to find.
  • The need for having more consistency with the “Preview Site” feature and/or implementing a Browse Mode was then discussed after @paaljoachim raised the topic ahead of time. Folks are going to expect similar functionality for Preview as the Post Editor and we still see folks viewing the front end of their site to see how changes are impacting the site, rather than being able to rely on what’s in the Site Editor. There was also a request to be able to drag around the current Preview in the site editor similar to what one can do with the template part focus mode. This is under discussion!
  • This led to a discussion around both expanding what templates can be created and unifying the experience with template editing mode and the site editor. For example, folks already are wanting the ability to add a custom template for a specific categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. of posts and there’s not a way to do that now with 5.9.
  • Generally speaking, there are still some discrepancies between the post editor and site editor. It’s a tough balance to strike to have both familiar tooling in both while also making it clear how the changes in the Site Editor are more global.
  • @fabiankaegy brought up how in the post editor the break points are no longer applying correctly due to post editor not being iframed yet! This is a big issue for custom builds when list view and the sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. are open so there’s excitement for iframing coming to the post editor in the future.
  • We then dove into how the post editor experience might be improved for 6.0 by looking at an exploration from @shaunandrews on improving the post editor sidebar. A suggestion was made to include auto-detection of post formats!
  • We had a fairly lengthy discussion about all things Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block including everything from wanting to see expanded functionality, more patterns, more variations, a revamped building experience, etc. This included talking about how folks who aren’t as technical might interact with it (likely through patterns and variations).
    • Consider creating a builder for the Query Loop block.
    • Add filters to extend the block and help prevent the need to fork it.
    • Add new functionality like no results found, sticky post, etc.
    • Change the category of the Pattern inserter to be more user friendly rather than relying on “Query”.
    • Consider having a welcome guide for the block.
    • Make it easier to change the number of posts displayed and clarify the concept of “offset”.
  • We touched on the Webfonts API and the excitement there to see this implemented, especially so testing doesn’t have to happen in three editors (amongst other things).
  • We dove deep on the topic of block theme switching, being able to schedule changes, have style variations, and the possibility of a style directory! This included checking out @critterverse‘s design explorations on block theme switching and style variation switching.
  • This led to a big topic around naming! What are users typing into Google already? What should folks call this experience far into the future? How can we communicate these concepts now? We had more questions than answers. From @overclokk: “About the editor naming, I made a video for Italian people to explain the difference about content editor, template editor and site editor because it is not so easy to understand which one to use when do things. Most of the search are about “gutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ editor”.
  • The oEmbed block was briefly discussed in terms of is needing 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) improvements. I’m going to track this down.  
  • The modal for the pattern explorer was raised as a topic with an idea around whether there could be more visual overlap between the modal and the directory itself potentially. Either way, it would be excellent to have better organization for 6.0.
  • We ended chatting about the WordPress Photo Directory and possible future integration. It’s unlikely for 6.0 just due to the lack of photos but there was lots of excitement around the possibilities of integration in the future regardless! Consider this a nudge to submit your photos (especially cat photos!).

#fse-hallway-hangout, #fse-outreach-program

annezazu 3:07 pm on October 20, 2021
Tags: fse-hallway-hangout,   

Hallway Hangout: 5.9 Go/No Go, Site Editor IA, and more

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. 

As a reminder, there’s one week left to share your questions about FSE.

Attendance:

Thank you to everyone who took time out of their lives to attend. It’s always lovely to see your faces and have time to chat. @overclokk @karmatosed @get_dave @annezazu @asilver @fabiankaegy @kafleg @mburridge

Video Recording:

Topics Covered:

We mainly focused on three items: the Go/No Go recap, the Site Editing IA concepts, and the Navigation Editor & Block work.

For the Go/No Go, we chatted about items we were excited for, including talking through @karmatosed wonderful patternspiration.com where she’s started to make art-like creations. This spurred the idea of a virtual museum of art made from blocks that yours truly just might try to make a reality.

From there, we moved on to walk through the various early design explorations for the Site Editing IA. This led to a lively discussion alongside walking through both the current experience and the various prototypes. We talked about the changes in colors between the different interfaces, how much friction to add/remove for various pieces, and which might make the most sense for 5.9. @fabiankaegy had some great feedback around including more than just the headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. and footer for the Separate exploration but in a view only manner similar to what currently is available with locking things in patterns.

Finally, we covered the latest on the Navigation Editor and BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. work. @get_dave was kind enough to talk through where the project currently stands with focus shifting to the Navigation Block in order to then lay the foundation for the Navigation Editor. A key part of this work right now is “separating the navigation’s presentation from its data in order to make navigations reusable”. This will allow both for easier block theme switching while retaining menu data and for menus to be edited in a template part without creating a local copy. If folks have time, check out these two PRs to help move this important work forward: Save Navigation Block data to a wp_navigation post type and Try using a template part in the navigation block.

#fse-hallway-hangout, #fse-outreach-program

annezazu 9:17 pm on October 6, 2021
Tags: fse-hallway-hangout,   

Hallway Hangout: Pattern Party Testing Walkthrough (6 October)

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. It was intended to be a casual walkthrough of the current call for testing with @sparklingrobots taking the lead sharing their screen. Big thank you for being brave enough to meander around the call for testing publicly.

As a reminder, there is still 1 week left to participate so please join in if you can.

Attendance:

 Thank you to everyone who attended 🙂 @karmatosed @mkaz @shaunandrews @paaljoachim @annezazu @sparklingrobots @richtabor

Video Recording:

Feedback Overview

Throughout the session, some specific issues were noted as problem areas to follow up on, including some previous reported and some new:

  • It’s not clear when you are adding a theme blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. outside of the Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. vs within. In this case, it was confusing when the Post Comment Count block wasn’t properly displaying the number of comments and it wasn’t clear the issue was that it needed to be within the loop. There’s an open issue to discuss this general phenomenon.
  • She had a desire to change the post excerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. length, which has an open enhancement issue.
  • There was an issue with the post title overflowing outside the bounds of a Query Loop block pattern. Need to replicate and open an issue!
  • There was a strange Inserter issue where you couldn’t find any theme blocks based on the current block you were selecting. Need to replicate and open an issue!
  • The call for testing itself needed to have updated instructions as you need to install GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ first before activating a block theme. This was updated live on the call.

Outside of specific points of feedback about the experience, there were also high level themes that became apparent as @sparklingrobots made her way:

  • They were confused about where various settings were expected to be, sometimes seeking out the block toolbar and other times the block sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme.. For example, it was unclear at a glance how to change width of overall query and how to change the number of posts displayed.
  • The placeholders for various theme blocks were underwhelming and often not informative enough to know quite how to customize.
  • She was confused by how by selecting one Query Loop pattern, they instead ended up with two Query Loops! This is part of one of the default patterns included in the Query Loop block and could cause confusion long term when thinking about having more complex patterns.
  • There was a desire for more dimension controls for various blocks including the Columns Block and Post Comments block. This is under active iteration!

We ended the call talking about how the future of the Query Loop block powering more user friendly variations, an integrated block pattern library, an overhaul of the IA of the various design tools, & more will help ease this current experience. For now though, we’re in an in between state where loads can still be learned to improve the default tools themselves.

Next Steps

@annezazu will follow up next week after she returns (she’s out Thurs/Fri) to replicate and open issues.

#fse-hallway-hangout, #fse-outreach-program