After so much planning, research, anticipation and work, I’m excited to get to show off the new Adventist Living Pattern System (ALPS). While it’s not perfectly finished (it probably never will be), it’s time to turn the lights on and let the world take a look at the Adventist Church’s shiny new pattern system.
Over the last six months, we have been working hard to get this project product off the ground. There has been hours of meetings with our team at the General Conference, consultations with communicators and web developers from the larger church community, and countless hours of work put in by Dan Mall, and his team from Superfriendly: TJ Pitre, Crystal Vitelli, Rob Adams, and Seth Hannah.
In the last 6+ weeks, I’ve been traveling to various regional meetings to present ALPS to communicators in the North American Division, Euro-Asia Division, Inter-European Division and several different meetings within the General Conference. After every meeting, people have come away excited about what we have created, and ready to deploy on their projects.
I’m guessing you are ready to see this too, so lets get on with it!
A few things you should know
Navigating
The first thing you should know about the ALPS site is how to get around. When you visit the site, you’ll see the molecule icon in the upper right corner. That’s the navigation for ALPS that will help you find the atoms, molecules, organisms, templates and pages.
Each pattern is surrounded by an iframe (in teal) that allows you to resize the width of each window to experience it at different viewports. Using the controls in the menu, you can set the viewport to a preset size (Small, Medium, Large and Full) a precise size, or even open to original window outside of iframe.
Getting the Code
While you can always view source, at the bottom of each pattern you will find two tabs, “HTML” and “Mustache”. If you are creating or editing a page, the HTML section is what you will want. This gives the exact HTML in the example you are looking at. The Mustache tab is what ALPS uses in the background to generate the pattern displayed.
Annotations
As you browse through the ALPS site, you will find, on some patterns, an annotation. While currently not complete, these allow us to describe a little more about the thinking behind the pattern, and link to background information.
Pattern Status and Meta Information
On each pattern page, there is a section of pattern meta information that includes pattern status, as well as a “Contains” and “Included In” section.
The status is one of 3 states: In Progress, In Review, and Complete. These status’ are denoted in the menu as Red, Yellow and Green dots as well.
Since patterns can be nested, the “Contains” and “Included In” sections list the names of patterns that make up the current pattern, as well as the patterns this one is a part of.
The Theme Switcher
While you are browsing the Templates and Pages, give the Theme Switcher a try. You can see how the 7 primary and 2 secondary colors interact, as well as how the Dark mode works. (Note: Not all the color combinations work well in Dark mode.)
The Good Stuff
I bet you are ready to see ALPS, so I’ll wrap this up. Our next step is setup the CDN that will provide access to the CSS and Javascript that you can include in your pages to create an ALPS theme implementation.
Just this last week I started working on a simple 1-3 page site for a project using a static page generator. It only took me an hour or so to get the basic shape of the code worked out, and then I was copying and pasting code out of the library for patterns I wanted to use.
We Are Just Getting Started
While lots of work has been done, we are only just getting started. This library, and the code behind it, is just the beginning. We built it based on the design of Adventist.org, but with the intention of adding more as we go. So if you don’t see something that you need, ask. File an issue on GitHub. The more information you provide (image, example, code) the easier it will be to create the pattern and the sooner we can incorporate it for everyone.
The Goods
Here is what you really want:
What do you think? Share your comments below, we’d love to hear from you!
13 comments
As I’ve mentioned Brent I don’t have any coding or technical background and I have no idea how this will integrate with our NetAdventist system.
What I do know is that it’s a lot of work, it looks super nice and I can’t wait to start using it.
What I’d like to see when it’s done & ready to go is promotion filtering to the conferences & onto the individual churches – it really is something for local churches to get excited about.
For the sake of dummies like me I’d also like to see good clear documentation on how it works & how we use it.
Cheers
Thanks for your comments, Robbie! We haven’t talked about it yet, but we are working hard to incorporate ALPS into several CMS systems, including NetAdventist and hope to have news to share soon. When we do get them incorporated, you can bet we will be talking loudly about it, because we want as many people as possible to be able to use it!
Definitely!
From personal experience I haven’t found NetAdventist overly inspiring and a lot of church sites are discouraging more than anything else.
I’ve spent a small age customizing my own church theme to the stage it’s at (and it still doesn’t have a footer area) and it’s mostly been trial & error – it’s mobile friendly & doesn’t look too bad but I don’t think many others would have the patience to do what I’ve done. Wold be nice to see the old theme’s ditched & a new standardized one based on the ALPS formatting so people just have to worry about adding great content.
I don’t know if it’s included in the new setup but I do like the idea of a title bar as I have for most of my pages. I did have to create a separate div section for the title bar to remove all the padding stuff as opposed to the main body of each page. The same goes for the carousel.
I’ve been looking at the Adventist Living Pattern System (ALPS) today and it looks great. However, one thing I haven’t seen available to use for church websites in a while is a “media ministries live streaming player”. Adventist Church Connect had one, but it hasn’t been maintained. I don’t know if NetAdventist ever had one. Over the last few years, I’ve maintained one for our site, but I will admit that keeping up with it has been a challenge with the shift to HTML5 video (a good thing) and the times 3ABN, Hope Channel, etc. have switched streaming CDNs (a frustrating thing).
Could a “media ministries live streaming player” be included in the ALPS as an “atom” that churches can easily utilize regardless of their CMS?
If you look at https://mtpleasanttxsda.org/3abn you can see an example of the code I try to maintain and how I’ve utilized web “aliases” were possible to help keep the code updates to a minimum. I may not have the best method out there though….
While embedding your media player inside a pattern is just what this is designed for, actually including the code of your player in ALPS is beyond the scope of this project. Since your player is most likely an iframe, it could be embedded in to any number of places, but also themes. That is something to better include at a CMS level.
Thanks for following the project and for your comments.
Just a question. How can I get the raw html templates to use? I downloaded the files, but I see quite a few MUSTACHE files. I was hoping to find HTML templates that I can integrate into a CMS of choice, like the previous ones available for download.
Looks great by the way! Delighted to know that you have gotten this far with it.
Did you see the HTML field at the bottom of the page, for example here? Each pattern has something like that. That said, if you follow the instructions in the README file on GitHub, you will can generate the same HTML files that are on the server.
Would that work for you?
My question for now is when is the GC going to adopt the new version? I am observing that it will make much more sense for us to adopt the new version if the GC has made the changes so that our sites can match. Is the new framework you just released in beta version or is it the final? If development is still ongoing please let me know so I can through in my contributions and suggestions.
We are in the process of updating Adventist.org to use the new ALPS framework. We plan to have done on that site by the beginning of October 2016.
The development status is probably best termed as Beta. Most of the main templates and patterns are finalized, however there are still things that can be added and adapted so we would love to have your contributions! You can see and example of the items currently listed on the issue queue now: https://github.com/adventistchurch/alps/issues
But we will always be open to contributions. If you have issues, suggestions or ideas you would like to see included, feel free to contribute by creating an issue in Github.
Thank you Brent, that helps indeed. Definitely would like to be part of the development team and help where I can.
Hi, I don’t know much about coding, but I was wondering if this would be something that could work with Squarespace or not?
I’m sure it could, I just haven’t explored SquareSpace much myself. I’d love to see a SquareSpace-based theme. Are you using SquareSpace?
Hello,
I tired our ALPS at the start of the year and i wrote to you about some of the challenges i was facing. I have since then found ways to use it.
I am currently having a challenge; when i copy the ALPS html code into my project, the colors are still not working.
Dan Machese Uganda