A Designer’s Agenda
Thoughts When Designing A Conference Website
6/6/16: Updated links now that the conference site is officially outdated. This article is in reference to Agencyport’s 2015 conference website and is still viewable here.
Every year, Agencyport holds a conference connecting within the insurance industry. It’s a great opportunity to show off AP’s product offerings, gather feedback, and network with others in the community. This year, I had the opportunity to design the conference’s website. The overall look and feel is inspired by this year’s destination, Chatham.
Along with decisions such as font choice, color palette, and other visual design elements, one page in particular required deeper-level thinking: the agenda. For any conference website, this is where multiple levels of information come into play — all of which are particularly important for its attendees.
In search of inspiration, I looked at various conference websites to take note of what I liked and what I didn’t. I looked for websites that were easy to navigate, visually interesting, and appealed to me as a potential conference-goer. Naturally, I found myself honing in on design conferences specifically, assuming that they would be shining examples of what to emulate.
The typography is nice and simple, and the inclusion of speaker’s photos makes it easy to identify them during the conference. It’s interesting to note that the speaker’s name is larger than the title of the lecture. Seeing as people usually chose what to attend based on the speaker, I could see the reasoning behind this design choice.
Brand New Conference
Aesthetically, the use of the grid and the subtle texture in the background appealed to me. Here, the person’s name links to a page with a biography and their contact information, which is very helpful post-conference. It’s easy to miss someone’s twitter handle at the bottom of their slide deck!
Once again, the events are sectioned off in a glance-able way. The photos of people with their names overlaid is a nice touch, not-to-mention a way to make use of the lack of space.
Depending on the size of the conference — the number of speakers, how many days, etc — the needs of each conference website differ slightly. A conference spanning several days could benefit some kind of filtering option, for example. In general, some aspects to keep in mind:
- Strive for Clarity: I preferred websites where the schedules were in some kind of table-like format as opposed to a list. This makes it easy to compare events in the same time-slot, or to simply distinguish one day from another. I also preferred agendas where the information was available without too much fuss — as in information hidden inside collapsible panels or excessive links.
- Speakers Come First: Obviously, people want to attend events lead by people they are already interested in. Make it clear who is involved and include any relevant information in their individual biographies.
- Keep Time Handy: After speakers, I believe time is the next important factor. Some people can only attend parts of conferences, or they want to carefully consider events happening simultaneously. Start and end times are crucial — particularly for events that go on longer than others.
- Location, Location, Location: On that note, for events that take place literally one after another, it’s important to denote location. A conference-goer will want to know if lectures take place on opposites side of a building.
- Sweat The Small Stuff: If it’s a party, there may be an age cut-off. For some conferences, attendees are expected to get their own lunch. These unique bits of information are important to include. No one wants to interrupt their favorite lecturer with a grumbling stomach.
A new addition to this year’s conference website is the implementation of a “track” system. Some events are geared towards a specific audience, which are separated into tracks. Using color, the anchor icons to make it clear which pertains to each track. I used popovers so that it would be easier to compare track colors to those listed in the descriptions. I didn’t want to solely rely on color in case of users visually unable to distinguish them.
There was some hesitation to the use of popovers, particularly for a mobile device. The solution was popovers for a desktop view, and collapsible panels for anything smaller. It’s more difficult to style popovers on a mobile-device, but collapsible panels give a similar effect. However, I thought they took too much space on a desktop screen to use it for both views.
I added some effects specifically to make it easier for an older audience, such as the ability to hover over a row and have it highlighted. I also used alternating colors for the rows so it would be easier to match time with description.
Originally, I had it so each tab was scrollable, to make it so the track appears at all times. In the end, however, I ended up taking that functionality out to avoid making the page too complicated.
The result is an agenda with each day it’s own tab. This way, there’s less chance of mixing up days. I implemented a table-like system to organize the information in a clean, simple way. The addition of speakers and locations will add more layers that I hope to keep just as organized.
For this first draft of the agenda, we don’t have speakers or locations set in stone. We merely want to engage our customers and past conference-goers with the type of content they can expect at the conference. Having tracks helps in this way, as we are dividing up content based on audience.
Once I have more information, I will definitely be paying close attention to speakers’ bios. Having an image as well as helpful links such as Twitter or LinkedIn profiles will further convince conference-goers to attend. The more information, the more they can prepare themselves for meeting in person and staying in touch beyond the conference.
As I work on the conference page, I have been working closely with AP’s marketing team. The conference is an event we hold very dear at AP, and I couldn’t make this website without their help! Stay tuned as it is finalized!
If anyone has any thoughts to chime in, please comment below. Also recommend this article if you found it at all helpful :)