H1 titles are ignored in the table of contents. We always start the table of contents links with H2.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila! Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
Since the website plugin was so popular, we didn’t know how users would react to any type of modifications to it—let alone large-scale, structural changes. To test the waters, we reached out to some of our power users. First, we informed them about Google’s new requirement, then asked them what type of solutions they might be comfortable with given the circumstances.
Throughout the discussion, it became clear that our users’ wants were directly opposed to the technical limitation from Google. Namely, they wanted their clients to stay on their website. This was due to 3 main factors:
The hard part here was—I agreed! I didn’t want to take their leads off of their website or interrupt their user flows. However, due to the impending restriction, we had to figure out a solution or else the plugin would be rendered useless. After explaining those circumstances, people were generally down to brainstorm with us.
Add a new feature to the Buildout Marketing product for Brokers to be informed of interested Buyers
Create a new product for Buyers to browse listings and mark their interest
Since this project made things worse in some ways for our users, I wondered if we decrease the pain by adding new functionality that would benefit them in other ways. Sure, we have to take your leads away from your website, but could we create an experience that is better for them and results in them viewing more of your documents? Were there new features you wanted that we could give you in return?
In my interviews, people reacted positively to this prospect and it gave us solace that, if we could add enough value to this new experience, it would soften the blow of forced change.
After taking in all of this research, my PM and I synthesized it into 3 success markers for this project. We knew that if we did not succeed at all 3, this project do more harm than good. Therefore, we constantly evaluated every idea through these lenses to make sure it was actually helping us do what we set out to do.
With these goals in mind, I began ideating on what a new document viewing experience could entail. To start, I listed out everything that people did not like about the plugin today:
Then, I combed through feature requests and old interviews to see what things people have asked for in the past:
Last, I added some of my own ideas of things that could be valuable:
Now that I had the whole picture of what I was designing for, I dove into Figma to create a solution. I sought to combine all of the above features into one experience:
After a few iterations, I landed on a version that acheived that:
The final design that gave users a way to see documents and perform actions all in one view.
Since we were now re-directing users to Buildout's Connect domain, we added the ability for them to see all the listings they had viewed across all brokerages.
The document viewer was only half of this solution, however. The more complex part was the step between a user being on a brokerage website and then being redirected to a Buildout website.
If not done correctly, users could get confused and give up, resulting in our clients losing leads—and that’s not the recipe for a successful feature. Therefore, I sought out to design an experience that was as clear as possible
We prototyped this whole flow and ran by the same power users we had originally interviewed. They liked the solution and were happy with the new features.
Since this was a change to a highly-used feature, we decided the best way to get real-world feedback was to run a small beta-test of the new experience.
After having 10 very active accounts use this for 3 months, there were two major takeaways:
This was good news to hear, as it meant only one of our solutions needed to be tweaked. To do this, we decided to get rid of the interstitial screen and take users right to the document viewer. This more clearly showed them what logging in would give them--documents.
After seeing that our final tweaks improved user understanding, we launched this new experience to all our users at once. The results have been genuinely positive for both our users and their clients.
This project stemmed from a technical requirement from Google. Instead of thinking of it as a burden, however, it helped to think of it as an opportunity to do something new. Sure, we have to do this, but what else does it allow us to do while we’re here?
Interviews are helpful, but they pale in comparison to real-world feedback. Being able to run a beta on this project gave us so much more insight, so much more quickly as to how our users and their clients responded to our changes. Since they’re actually using the product for their day-to-day business, they gave us feedback wouldn’t have come up in hypothetical questioning.
Even though Google didn’t end up taking away third-party cookies, this feature was still worth building. Through the discovery process on this project, we also heard user frustration with the way we handled user permissions. This feedback was the impetus for us to take a look at improving that feature a few months later.