Crystal Meth Anonymous serving Washington DC, Maryland, Northern Virginia and online worldwide

ADDICTION DOES NOT TAKE A HOLIDAY
Join us daily this holiday season
Designlog
Official blog of the Public Information Committee

Today, we’re excited to unveil the all-new Trusted Servants Portal 0.3.0—a complete redesign with a fresh interface and streamlined organization to help our trusted servants access vital meeting documents faster and more efficiently. Every element has been rebuilt on a brand-new foundation, and we can’t wait to see it in action across our fellowship.

Document Finder

First, let’s talk about the new Document Finder sidebar. It’s now available on every page and dynamically pulls in all meetings from dccma.com. A simple click on any meeting will take you to a page displaying everything related to that meeting: scripts, readings, files, external links, meeting times and summaries, logos, and if it’s online, Zoom details—including the assigned Intergroup account. It’s all in one place, so no more searching across multiple pages. Plus, with our new sync function between the portal and dccma.com, everything stays up-to-date automatically.

Libraries

Next, we’ve consolidated all non-script documents into a single, unified Libraries page. From literature scans and readings to Intergroup documents and external links, it’s all here. A new sidebar with a dynamic Table of Contents lets you instantly navigate to the section you need. As new documents are added, the page and any related areas of the portal update seamlessly. For instance, CMA-approved books for the Sunday Morning Meeting are now automatically pulled from the library—eliminating extra navigation.

Mega Menu

We’ve also completely redesigned the mega menu for simplicity and ease of use. Each section now includes a dynamic summary, and we’ve merged previously separate pages to improve clarity. Additionally, we’ve integrated a feedback button, making it easier for our trusted servants to provide input as we continue to refine the portal.

Behind the Scenes

On the technical side, the login process has been enhanced for improved security, now requiring both a username and password. However, meeting PDFs remain publicly sharable, as before. We’ve rebuilt the entire site using Breakdance instead of Elementor, reducing the number of plugins and significantly boosting performance.

Zoom account information is now centralized, so updates made in one place are automatically reflected in all assigned meetings. We’ve also implemented a sync feature to pull meeting data directly from dccma.com, eliminating redundancy and ensuring everything stays in sync between the two sites. Nearly all static content has been replaced with dynamic elements, moving us closer to a fully responsive portal.

Our Biggest Release Yet

Trusted Servants Portal 0.3.0 is our most significant update ever, solving numerous issues while introducing faster, easier ways to access the information you need. We’re thrilled to see how it enhances meetings across the Intergroup.

As always, we value your feedback! Email [email protected] or use the Leave Feedback button directly in the portal.

In service,
Jason M.

With release 0.2.13 and 0.2.14 we have introduced some exciting new features to dccma.com that we’re sure you’re going to love. Let’s start with the Live Meetings Bar.

Live Meetings Bar

When an online meeting is scheduled to begin, our Live Meetings Bar will appear above the header displaying the name of the meeting along with a handy Join Zoom Meeting button to rapidly facilitate access. This yellow bar appears at the fellowship open time for each meeting and disappears once the meeting concludes at it’s scheduled time. We think the Live Meetings Bar will dramatically improve our user’s experience by reducing the amount of clicking/tapping/scrolling required to find the current meeting.

Upcoming Events

Because of the extensive work done in release 0.2.11 to make more information dynamic on the site, we are pleased to introduce a new section to the homepage called Upcoming Events. This section will dynamically display fellowship events in ascending order by date with event names, dates, times and featured image all pulled from announcement posts that contain event data. Additionally a View Event button is present that will link to the connected post in order to display more information. This section will live on the homepage to the right of Today’s Meetings on the desktop, and under it on tablet/mobile. Upcoming Events gives our users at-a-glace access to upcoming events without having to parse through more lengthy announcements and we couldn’t be more excited!

Announcement Cards with Event Data

Event information added to an announcement post will be displayed dynamically under the post’s text anywhere announcement cards are displayed such as the homepage, Announcements page and single announcement post pages. The data displayed includes the date and time of the event, location name and address, event contact name, phone number and email address along with buttons for website links like Eventbrite, Google Maps directions and Zoom links with meeting ID and passcode. We think displaying this information in a structured way will provide a much better user experience and are thrilled to launch this new format today.

The last several releases have been full of much needed features as we continue to look for ways to help our fellows in their recovery journeys through smart design and thoughtful content. As always, we encourage your service and participation in this process! Send us your feedback to [email protected]

For more technical details on this and all releases, checkout our changelog

Dynamic data

We are pleased to introduce some “under the hood” changes to the DC CMA web experience that will improve access to meeting information across all areas of the site. Until now, pages containing meeting information were static and had to be manually updated page by page which introduced risk of error as well as increased time and complexity for the admin. To mitigate this, we have moved all meeting information into the structured database and will pull this information dynamically. This way, we can make edits once and have all views on the site that use that data update concurrently. This increases maintainability of the site going forward and better aligns to common best-practices.

Today’s Meetings

Because of the efforts in converting the meeting information into structured dynamic data, we are pleased to introduce a new section to the home page entitled “Today’s Meetings.” This section automatically updates to show the current day’s meetings in chronological order. By doing this, we hope to deliver a faster way for users to find their next meeting without too many clicks/taps.

Meeting Card Pages

Finally, we are also introducing individual meeting card pages that can be shared with fellows using a simple URL. These are accessible by clicking the title of any meeting card either on the homepage’s Today’s Meetings, Meetings beta or one of our legacy pages like Online Meetings and In-Person Meetings. The URL is clean with dccma.com/meetings/meeting-title/ so you can simply copy, paste and send.

While the changes to the end-user experience may seem minor, the behind the scenes work makes this one of the biggest upgrades we’re done to the site since we launched over 3 years ago. As always feedback is encouraged! Simply email [email protected]

Today we are pleased to introduce a new beta feature we’re calling Hyperlist: an accessibility first meetings list specifically designed for ease of access and readability for users with visual impairments. Our existing card-based interfaces such as those on the Online Meetings or Meetings beta pages present challenges for users who rely on voice tools such as Apple’s VoiceOver or Microsoft’s Narrator. Hyperlist is an answer to those challenges. You can access Hyperlist by clicking the navigation link at the top left of the header (or on top of the header on mobile) . This is positioned to be the very first link for users when using voice navigation, easing access.

The structure of the page has been designed to facilitate clearer page navigation with meeting names, days of the week, meeting times and details uniformly structured line by line for better navigation with voice tools. The text is a bold sans-serif sized using REM units that easily scale up or down based on the user’s base font size setting in-browser. The layout also shifts for clear mobile viewing as well.

As with all beta features, we encourage our users to send us their feedback. We think Hyperlist is a great addition to dccma.com and look forward to improving it and all our beta features into 2024.

A faster way to find meetings on dccma.com

Today we’re introducing Meetings beta, an all new way to quickly and effortlessly find your next meeting on dccma.com. This technology preview will eventually become the primary way to browse our meeting directory and we’re really excited to launch it in beta form today. Simply navigate to dccma.com/meetings-beta, click on a weekday in the blue bar and that day’s meetings will dynamically populate from the right in chronological order. It’s that easy.

Our existing In-Person and Online meeting pages will remain unchanged until this page has come out of beta. We encourage all our users to try out the beta interface and leave us feedback. Become part of the process! Simply click the Leave Feedback link under the weekday buttons to get involved.

We think Meetings beta is going to improve user experience dramatically and we’re excited to see it put into service.

Today we’re introducing a whole host of changes to the look and feel of dccma.com that we’re really excited about. First is a new logo. For the first time we are including a horizontal version of the familiar ‘stacked’ design we’ve been using since 2020. Additionally we have transitioned away from gradients to a unified flat design aesthetic for all instances of the logo. But the biggest change here is the “M” which incorporates an abstract representation of two people holding hands. This reflects our mission: to reach the addict who still suffers with connection, love and friendship. It’s a small change with a big meaning that we think looks just great.

Color Schema

Since 2020, we have used bright blue as the primary color for our logo and various UI elements like buttons and the footer background. Today, we are moving to a darker, more saturated blue that increases readability on any screen size while keeping with current design trends. Throughout the site, we continue to emphasize white space to keep the UI clean and friendly. We have rolled out a fresh light gray color for certain sections of the UI such as page backgrounds and the title bar. This helps the logo and other clickable items stand out, lessening visual noise and calming the design down a bit. With an emphasis on lighter tones for background elements and saturated, darker tones for interactive elements, we can better guide the user to actionable parts of the site. Ultimately this leads to quicker access to information and a better user experience.

UI Proportions and Style Changes

The user interface throughout the site has been adjusted in size with larger type, more spacious padding around elements, increased header logo size, and a simplified mega menu navigation. Additionally, corner radiuses have been made globally rounder for elements such as buttons and information cards. We have also refined our responsive mobile and tablet layouts to better scale on those devices. Transitions between states have been made shorter to increase the feeling of UI snappiness. We have reintroduced softer shadows for the header and card elements and will continue to roll out shadows to elements where it makes sense. Flat design principals remain the preferred mode for most content on the site with a mixture of dimensional elements when necessary to accentuate depth or to call attention.

Motion Design

Beginning with the homepage and Intergroup pages, we are rolling out more Lottie animations across the site. Motion scrolling elements have been added to the ‘New to CMA?’ page as well as the homepage. Moving forward, we want to use motion elements to better support our mission but not distract from the information being displayed. A ‘less is more’ approach. We love restraint (though sometimes it’s hard!)

Looking Forward

There is a lot in the pipeline this year for the site. We will be launching the MARCMA page in the coming months and restyling a number of pages to better align with our new aesthetic. On the backend we will continue to optimize content and plugins for faster page loads. There’s a lot to be excited about and we are grateful to support our thriving ecosystem of in-person, online and hybrid meetings with relevant content and great design.

Made with love & serenity
DC CMA Logo
This popup summarizes posted announcements for GSRs to quickly read during halftime in meetings. Click/tap on each line to navigate to the full announcement or click the X to close.

GSR Announcements Summary

Ver. 0.2.18
Changelog
0.2.18
November 27, 2024
  • Added GSR Announcements Summary popup which provides an abbreviated list of posted announcements that GSRs can use in meetings. Clicking/tapping on the announcement summary links to the post for further reading
0.2.17
November 14, 2024
  • Added calendar .ics file generation to events that will automatically alert you 1 hour prior to event time with a display alert
0.2.16
October 16, 2024
  • Upgraded ACF plugin with official version from WP Engine
0.2.15
September 27, 2024
  • Re-styled Announcements and Archive pages with title bar and integrated search field
  • Introduced new search results and archives browse loop in row style
  • Re-styled single meeting card post pages with "Meetings DC CMA" branding
  • Minor layout fixes
0.2.14.1
September 21, 2024
  • Fixed issue with page caching interfering with the functionality of the Live Meetings Bar
  • Fixed layout issues on /dzr and /dailycheckin pages
  • Removed Announcements section from homepage
  • Revised What is CMA? section on homepage
  • Added meeting special URL and meeting donation buttons to meeting cards loop
0.2.14
September 19, 2024
  • Added events fields functionality to announcement posts
  • Added events loops to announcement cards and single announcement post views
  • Added Upcoming Events section to homepage and queried events posts in ascending order based on event date
  • Various layout fixes
0.2.13
September 17, 2024
  • Added Live Meetings alert bar to header which displays the current online meeting in-progress along with a Zoom link
  • Added Meeting Card fields for fellowship start time and meeting end time in 24-hour integer format
  • Added URL field for orange alert text that appears on Meeting Cards
  • Updated Meetings beta to 0.1.1 and removed beta branding
  • Integrated reusable loop query for Meetings page cards to eliminate duplicated data
  • Depreciated Online and In-Person meetings pages and added redirects to /meetings
  • Integrated loop queries into Daily Check-In, Daily Zoom Round-Up and Dual-Diagnosis pages
  • Fixed tablet and mobile header top bar
  • Added Neo Brutal styles to additional elements
0.2.12
September 2, 2024
  • Changed header layout to left-aligned logo and right-aligned menu
  • Integrated mega menu into Elementor's native menuing widget and enabled it for mobile view
  • Removed mega menu hover dropdown from logo
  • Removed ElementsKit, Essential Add-Ons, and Shortcodes in Menus plugins
  • Fixed overflow layout issues on Online and In-Person pages
  • Added dates to Changelog layout
  • Added DZR elections page and form
0.2.11
August 20, 2024
  • Changed how meeting cards dynamically grab meeting information for display
  • Added centralized Site Version Number functionality
  • Revised layout of Online Meetings and In-Person Meetings page to pull dynamic meeting data using navigation tabs
  • Revised Hyperlist page to pull dynamic meeting data
  • Migrated to Linode and vertically scaled capacity to better handle load
  • Upgraded Changelog to pull dynamic post content
  • Added Today's Meetings section to homepage with dynamically updating cards based on the current date. Meetings are ordered from earliest to latest time.
  • Added custom post pages for displaying individual meeting cards
  • Added hyperlinks to the titles of meetings cards linking to individual card post pages
0.2.10
April 11, 2024
  • Fixed permission issue on Meetings beta page
  • Removed online meetings from In-Person Meetings page
  • Changed URL of In-Person Meetings page to /inperson
  • Changed URL of Meetings beta page to /meetings and created redirect
0.2.9
March 20, 2024
  • Performance optimization
  • Depreciated Calendar
  • Minor layout fixes
  • Added Hyperlist page
  • Changed single announcements post layout to horizontal card
0.2.8
November 11, 2023
  • Removed sticky header
  • Fixed announcements loop mobile layout

0.2.7
July 5, 2023
  • Introduced Meetings beta page
0.2.6
April 20, 2023
  • Introduced horizontal announcement cards for homepage and announcements page
  • Added webmail link to Site Index and Intergroup page
  • Minor layout fixes
0.2.5
February 1, 2023
  • Added MARCMA page
  • Fixed tablet layout issues on header
  • Moved “Posted On” date to the bottom of the announcement cards
  • Minor adjustments to elements
0.2.4
October 20, 2022
  • Expanded header and footer to full width on desktop
  • Centered logo on header and repositioned menus on desktop
  • Incorporated mega menu trigger into logo
  • Introduced new full width footer
  • Created Site Index slide-in
  • Revised Changelog slide-in
  • Refreshed Stories page and implemented Loop Grid queries
  • Minor layout fixes
0.2.3
September 7, 2022
  • Minor layout fixes
  • Standardized heading fonts H1 through H6 for uniformity
  • Transitioned more text elements to REM
  • Added CMA Fellowships Directory page
  • Fixed mobile menu 
0.2.2
August 23, 2022
  • Introduced new horizontal logo design and enlarged proportions on header
  • Thinned header
  • Recolored the title bar above header to pale gray
  • Introduced new color schema throughout site with more bold, contrasting colors against neutral backgrounds
  • Restyled New to CMA? page
  • Introduced new Intergroup logo with Lottie animation
  • Simplified homepage layout
  • Introduced design blog
  • Set button border radius to 15px site-wide
0.2.1
August 16, 2022
  • Replaced homepage slider with new hero design
  • Added Lottie animations
  • Added change log page
  • Implemented Loop Builder for queried posts
  • Redesigned announcements carousel on homepage
  • Redesigned announcements archive pages with infinite scroll
  • Minor fixes to layouts
  • Unified button color schema
  • Optimized database
  • Removed old page revisions for performance
0.2.0
July 17, 2022
  • Major release
  • New header layout
  • Implemented mega menu
  • Recolored major elements with more saturated hues
  • Homepage redesign with scrolling clouds motion at footer
  • Footer condensed and restyled
  • Added Daily Check-In page
0.1.10
March 1, 2022
  • Restyled Newcomer page with cloud graphics
  • Changed Newcomer page name to ‘New to CMA?’
0.1.9
February 1, 2022
  • Added Stories pages
  • Configured Stories category and blog query
0.1.8
September 30, 2021
  • Header rescaled and added background blur
0.1.7
July 20, 2021
  • Added Elections page
0.1.6
May 2, 2021
  • Added Online meetings page
0.1.5
April 15, 2021
  • Homepage refresh
  • Added Announcements carousel
0.1.4
March 10, 2021
  • Added Dual-Diagnosis page
0.1.3
February 20, 2021
  • Added Newcomer page
0.1.2
February 2, 2021
  • Introduced card-styled elements throughout site
  • Complete restyling of Meetings page with card-centric layout
0.1.0
January 15, 2021
  • Initial Release
0.1.1
January 5, 2021
  • Container reduced to 1140px
  • Header resized and  boxed
Made with love & serenity