Talking Duke Mobility

Responsive design. Mobile apps. Optimized for mobile devices.

Our most recent event of the Duke Communicators Network covered the topic of mobility. There’s a lot to talk about on the subject, and Blyth Morrell with the Office of Marketing and Strategic Communications gave a brief overview of the history of Duke mobile, trends in mobile usage and an update on where Duke is headed with our mobile strategy. Here is a copy of her Prezi from the event.

Next, a few Duke communicators and web developers updated the group on their most recent project. Brett Walters with the Duke Alumni Association covered recent projects with Duke Magazine, alumni and reunions. Sean Aery with Duke Libraries covered some of the most recent work they have done in responsive design and Will McCreery highlighted some recent project done by Duke Web Services including the new Duke Chapel site that is optimized for mobile.

Next up on our agenda of meetings for Duke Communicators is a social at Tylers Taproom in American Tobacco on Tuesday, December 18th starting at 4p.m. We hope to see you there!

Searching for Answers with Duke Communicators

In our most recent Duke Communicators meeting, we talked search. I presented with Leon Malahias and Blyth Morrell on search engine optimization and we talked about ways we can build Duke websites to get the most eyeballs on our content.

We provided an overview of search engines, described what affects search results, clarified paid versus “organic” searches and shared tips about how to improve rankings for Duke sites. The presentation was more show than tell, and featured a hands-on session where we went over how to build Google Authorship and identify the best keywords for content.

Here’s a link to our presentation with all of the code and resources we covered in the program. Save the date for our next program on mobile technology on December 11 from 2:00-3:00 p.m. The location will be Westbrook 0014 and we look forward to a great conversation and an update on Duke’s mobile landscape.

A PhotoWalk: Picture Duke University

A group of Duke students, staff and Durham residents recently took part in Duke’s first Photowalk, an adventure in photography across our campus.

The PhotoWalk was intended to build community by giving some budding photographers in our area some pointers and access to parts of campus they might otherwise not be able to see. Several member’s of Duke Photo’s team of experienced photographers shared their tips and tricks and told stories of their work as we explored campus during a two-hour walk.

We started at the Sarah P. Duke Gardens and continued on to Perkins Library, where we poked around inside the Gothic Reading Room and the Duke Chapel, where we got to climb Duke Chapel’s Tower. We then hit the Bryan Center Plaza and ended at Cameron Indoor Stadium.

More than 20 people took part in the walk. Many were devoted photography hobbyists who clearly have some talent, one as young as 12-year-old Jonathan Canfield.

The result of our adventures was a huge number of images captured and shared using #pictureDuke via Twitter and Instagram.

Image by Michael Palko

Image by Michael Palko

Image by Michael Palko

Tweet by Sarah Haas

Tweet by Katie Wood with Duke's Marine Lab

After the walk, participants uploaded their favorite photos to Duke Photography’s online database to enter a photography contest. We received 61 contest submissions and awarded a total of 8 prizewinners, with the grand prize winning an opportunity to accompany the Duke Photography crew on a major photo shoot.

Here is a collection of the images on Facebook.

We hope to do more PhotoWalks at Duke in the future. Spring is begging for another walk through the Sarah P. Duke Gardens, and we would love to feature beautiful spaces like the Nasher Museum of Art or our vibrant East Campus in the future. What would YOU like to see on Duke PhotoWalks?

 

A Duke Faculty Social Media Workshop

Last Friday, about 70 Duke faculty and staff attended a two-hour workshop on how best to use social media tools in the classroom and beyond. The workshop was hosted by Duke’s Office of News & Communications (ONC), which holds a number of training sessions during the year for the Duke community, including ones covering such topics as how to write and publish Op-Ed articles or how to conduct interviews with the media.

Last week’s program began with David Jarmul, ONC’s Associate Vice President of News and Communications, welcoming participants to the workshop and setting the scene for the morning.

David Jarmul welcoming Duke faculty at our social media workshop

For the first hour of the workshop, I led a panel of five Duke faculty and staff members who have been using social media tools. Jennifer Ahern-Dodson, Mark Anthony Neal, David Schanzer, Tawnee Milko and Peter Ubel all did an amazing job describing their experiences with tools like blogging, Twitter and Facebook, including what has and hasn’t worked for them and how they’ve incorporated social media into their classes. Here is a link to all of the sites and examples we shared during the first hour.

In the second half of the program, workshop attendees divided into two groups. I led a discussion among people familiar with social media about how they can more effectively use blogs, Twitter and other tools and reviewed accepted best practices. Here is a link to my Prezi outline.

Jonathan Lee, ONC’s social and digital media fellow, instructed those new to social media on how to set up a Facebook page, Twitter account or blog, among other things. Here is a link to Jonathan’s presentation and a quick handout we prepared on tips and tricks for getting started with these tools.

Attendees live tweeted during the workshop using the hashtag #DukeSocial.

Finally, Jonathan and I are happy to follow up with attendees on any questions or comments they have about the workshop. We also want to do a quick commercial for Duke’s Center for Instructional Technology, whose great folks do regular training sessions on getting started with social media and blogging tools. They also offer free access to Lynda.com online courses (which include TONS of options for learning more about social media) for anyone with a Duke NetID.

We hope to see you at ONC’s next workshop! Stay tuned to Duke Today for information on upcoming opportunities.

#pictureDuke


How do you picture Duke?
 Join students, staff and members of the greater Duke community for a photo walk, a visual odyssey, across West Campus on Friday, November 2, 2-4PM. Whether you are an amateur or a professional, a DSLR devotee or a camera phone fan, come share lessons & experiences with other participants. After the walk, submit your favorite photos and showcase your talent to the Duke community. You’ll have the chance to win great prizes, and your work may even be featured on Duke.edu!

What is a photo walk? A photo walk is an organized opportunity for photographers (both professional and amatuer) to visually explore a space and interact with each other. We’re hosting#pictureDuke on campus so that participants can capture campus architecture, student life and athletic & academic initiatives while sharing experiences with each other and workshopping with our talented Duke Photography crew. If you’re on Twitter or Instagram, share your experience using the #pictureDuke hashtag too!

How do I enter the contest? After the walk, upload your two favorite photographs from each location to Duke Photography’s online database. Be sure to include the #pictureDuke hashtag in your caption so that it is grouped with other contest entries. Prizes include clothing & merchandise from Duke Stores and the grand prize is the chance to accompany the Duke Photography crew on a major photo shoot.

The low down:

Who? Photographers of all skill levels

What? Photo walk

When? Friday, November 2, 2-4PM

Where? Duke University West Campus starting at the Sarah P. Duke Gardens

How?  

Join the Facebook event.

Follow our blog updates.

#pictureDuke is sponsored by Duke Photography, Duke University Stores and the Duke University Office of News & Communications.

5 Blogging Tips For Newbies

This is a guest blog post by Fenella Saunders, managing editor at American Scientist, who attended the Back to the Blog conference at Duke University on October 13, 2012.

If you’ve opened this post, you’ve probably already seen the attractiveness of one major blog tip for newbies: Use a number in your title that will give people a list they can scan quickly and take away some pithy information about how to do something. (And apparently odd numbers are more attractive than even ones.)

That was one of the points brought up at the “Back to the Blog” workshop held at Duke University on October 13. Anton Zuiker and Cara Rousseau organized some great information and guest speakers for those who don’t know much about blogging. (See more links and details).

And, another source.

1. Sticking Around

Dave Thomas of Radian6.com talked about why one should blog in the age of social media. As he says, “Blogging is for Google, Facebook is for friends.” Their blog traffic is 2:1 from search engines over social media, even when they share posts over all the networks (Twitter, etc.).

The point is, social media is ephemeral, but blog posts last. They are resources that are still accessible and you can link back to things you have previously written when they are relevant.

On a related note, Thomas says that organizations who blog need to understand their own business goals. For example, his company’s blog has the main purpose of driving people to their ebooks.

(Their most popular blog post?)

The stream of information is so great, Thomas says, that you can “recycle” posting on social media about the same blog post several times and get the same number of hits each time.

Thomas also pointed out that Tumbler is a blog platform with a built-in network of people, making it more like social media, and something that WordPress lacks.

Copyblogger and Problogger are good sources for blog questions. For example.

2. Show Me

Thomas pointed out that video is currently the way to share with the world, and that’s easier on a blog. But the skill is to make a 3-minute video that is interesting, more than one that is of top-notch video quality. There is a 10-second dropoff time after which most people stop watching. Have a YouTube channel and link to it, as that’s the second largest search engine after Google. He gave an example of the Mayo Clinic as a place that is great about getting up video quickly, without spending weeks on editing.

Other resources: Xtranormal.com to make instant animations of a script you provide.

A boom mic for an iphone to get better sound with quick video.

3. Style Matters

Anton stepped in to bring up some resources next.

Woothemes.com and Themeforest.com have premium blog themes for $35-70 that include tools built in to embed video, audio or pictures. They also are responsive so they look good on mobile or big screens.

Speaking of style, a lot of blogs are moving from cluttered to clean. See angryrobot.ca for an example. It’s one single column of text, without a lot of links and distractions. Most blog readers find a post from a search engine, and all they want to do is read that one post, not everything else. So you want landing pages without a lot of distraction. Use a different stream (FB/Twitter) to conglomerate all of your posts into one index. Twitter is now more about linking to other content rather than firsthand posting.

Another example is om.co where there is a nav swipe on the left to pop out a menu but it drops off for mobile size screens.

Which is another point: Design for mobile first. WPTouch is a plugin that will make any WordPress blog mobile-ready.

Some blogs have gone the opposite way and have a long front screen with a very long scroll. Because of touchscreens and FB/Twitter, people now have less of an aversion to scrolling down and down a page.

A platform to watch is Medium.com from the creators of Twitter. It has a simple design and a network effect. There’s also svbtle.com, creating a network around a tool or topic.

Blogs can help to make event coverage highlight your interests. Take Newsjacking by David Meerman Scott. The idea is to have the first paragraph talk about the event, but the second paragraph is the angle that you can inject into a story, and it’s possible that others will pick up that content—as long as what you say adds value to the story.

4. Other Voices

How to deal with comments and possible trolls? Two mentioned plugins are Disqus and Gawker’s Kinja, which aims to “make intelligent comments easy to read.” Example:  You can also use Branch.com to set up a moderated/invited conversation that others can ask to join.

Several speakers pointed out that it’s ok to have a blog and not allow comments. If you do allow comments, it’s important to set up clear boundaries (no threats, harassment, racism etc.) and to remind people that this is your living room, not a public square, so they don’t have the right to comment. They can go off somewhere else on the Internet and set up their own posts if they want to have their own say in a way you don’t want on your own blog.

As a side note to the communication issue, regarding email one of the speakers, Paul Jones of UNC’s j-school, says “email is a horse and social medial is a car” so he’s completely given up on traditional email.

5. Join the Crowd

So how to get the world to even know your blog exists? Enter Bora Zivkovic, who runs the blogs at ScientificAmerican.com (a network of 47 different blogs). Blog networks such as scienceblogging.com can provide an index where people can go to see what’s new (but make sure you know the history of PepsiGate about the perils of corporate intrusion into blog networks.)

Bora emphasized that successful networks are ones where each blogger has an expertise and passion about a topic, but NOT an obsession. The difference is that in the former case, the posts are informative and are within a particular topic, but in the latter case the posts are always on EXACTLY the same thing. Blog posts are more in depth, but not manifestos. Bora advised potential bloggers to focus on what you understand well, but don’t spend days on it.

Getting contributors or guest bloggers for one post or a series is also a good way to network.

Connect with people who are already well connected, and follow early adopters to learn new tools.

Henry Copeland of blogads.com (who was such an early adopter of Twitter that his handle is simply @hc, giving him massive tech cred) pointed out that another way to use crowd assistance for mutual traffic driving is to add topics to a debate going on online, which is kind of like joining a team.

Henry’s final comment is a great summation of why blogging is still relevant: “If you think you’re late to blogging, there’s another train leaving tomorrow, and you can get on the new train while we’re all still on the old one.”

 

The new @DukeU on Twitter

Twitter recently launched several features to make user profiles more engaging, including a new header image. To take advantage of these additions, Duke’s social media team designed new graphics to use for our Twitter background and header images. Here’s a walkthrough of the approach.

the new @DukeU experience

The header:
The header is a new feature Twitter introduced in September that gives users an additional element of customization and personal branding. However, there are a few constraints:

Size:

Twitter recommends 1200x600px with a maximum file size of 5Mb.

Regardless of what file size you are working with, your final product should have a 2:1 aspect ratio.

Effects:

Twitter will automatically apply a darkening gradient to your header image, and layer white text over that gradient.

Execution:

our recently redesigned undergraduate admissions site

Though the size constraints actually give users a great degree of freedom, allowing users to upload hi-res files, we kept our header simple, which gave us more flexibility when designing the background. More on that later.

For inspiration we referred to the subtle, but graphically intriguing backgrounds on the new Duke Undergraduate Admissions site, and designed the header image shown below:

Twitter also applies a wide white stroke to your avatar and layers that over your header as well. To undercut the off-putting boldness of this effect, we changed our avatar to the blue on white version of our logo. This way the stroke appears to be a part of the image rather than a boundary constraining it.

 

The background:

Backgrounds are a bit trickier to deal with because different users will see different swathes of your image based on their monitor’s resolution and what browser they are using.

Size:

There are two kinds of boundaries to operate within. First, Twitter allows backgrounds up to 2048px wide (no height limit), with a maximum file size of 800KB. However, regardless of the background dimensions, viewers will only see what portions of it their monitor and browsers allow. While Twitter’s allowances tells us which perimeters we should design for, browser data dictates where we should place important content:

99% of Twitter visitors have at least a 1024px wide resolution. Twitter’s own content occupies 865px, so that leaves you with 132px (a pair of 66px gutters on either side of Twitter’s content) to work with. This is enough space for a logo or a brand name to descend down the side of the canvas, but doesn’t leave much room for other graphic elements.

85.4% of visitors have a 1280px or greater resolution. This gives designers 372px (194px on either side) to work with, and is the option we pursued. (Browser data from W3Schools Jan 2012)

Alignment:

Earlier, Twitter allowed backgrounds to be left-aligned only. This could be problematic for some designs since graphics were anchored to side of the user’s browser rather than anchored to the content, making the right-hand gutter functionless for incorporating further information. With the most recent update, users have the options to left-align, right-align, or center their background images. Centering allows users to make full use of both gutters, and also fixes design to your content.

The various background alignment options Twitter now offers.

Execution:

We created a 1920x1520px background at 72 ppi. We used the left gutter to create a banner 180px wide. For a the rest of the background, we used a high-resolution photograph.
Using a photo can present a few challenges. When using the header image feature, the user needs to be sure that the background and header don’t clash and compete with each other (or the profile photo) for the viewers attention. To negate this issue, we used a subtly patterned header, though the inverse is just as plausible – highlighting a photographic header and utilizing a clean graphic background. Combinations of dual photos or dual graphics work as well; it’s just a matter of finding visuals that compliment each other.

Additionally, because Twitter limits background images to 2048px in width, viewers with a browser resolution higher than this (or than your photo) will see empty canvas space on either side of the uploaded background. Popular solutions include having your background fade into whichever color you set as the background color (or utilizing a background that strongly features that color). However, since our background photograph features a wide range of colors, we selected a clean black from the Duke Style Guide to accentuate and showcase the photo.

A quick look at the 'Save for Web' panel in Adobe Illustrator. Key elements are highlighted.

Lastly, photos are typically much larger files than other kinds of graphics due to their color depth. Our final image was 7.6MB, well over the 800KB Twitter allows. To get our file size under this limit, we used Adobe Illustrator’s “Save for Web” feature to decrease the quality of the image.

By decreasing the file’s quality to 61%, we reduced the file size to 794.1K – right below the 800K mark – while introducing minimal artifacts. Naturally, a user can shift the balance the other way, in which image quality would be prioritized over photographic dimensions – it’s just comes down to what aspect the designer would like to optimize.

For those interested in adopting this background, we’ve provided the following resources:

Duke Social Media Twitter Background

Duke Social Media Twitter Header

 

Happy designing, and tweet on!

– Jonathan

Join us for Back to the Blog – 10/13/2012 at Duke University

It’s never been a better time to be a blogger.

Yes, Twitter and Facebook and Pinterest and Instagram and a slew of other social networks and apps are getting most of the attention in 2012, but 15 years into the world of blogging, there are exciting trends and threads that make being a blogger fun and interesting.

Back to the Blog

Explore these trends and threads with us on Sat., Oct. 13, 2012 at Back to the Blog, a review of what we’ve learned about using blogs to communicate and a look at the trends that are taking blogging forward.

Here are some of the things we’ll demonstrate, discuss and debate:

Style and Design – As we said back in 2005 at the Triangle Bloggers Conference, a blog is like a pencil, and you can use it to express yourself in any way you wish. We’ll feature some of our favorite blog styles, and look foward to your examples, too. And, blog design, using responsive design and simple themes, are getting back to an emphasis on making your words the focus. Rapid-design frameworks such as Bootstrap by Twitter and Foundation by Zurb offer new ways to quickly create a page. There are dozens and dozens of WordPress theme companies developing frameworks and families of themes. We’ll tour the design trends and review some of these tools.

Comments and discussions – Whether written by one person or a team, most blogs aim to start discussion. Blogs that band together can attract more attention (for example, there are many science blogging networks). New networks (see Mediumand Svbtle) are popping up to help bloggers focus on their ideas and writing. We’ll share examples and ask for your strategies for promoting your blog. And, new commenting and conversation tools – such as Disqus and Branch and OPML Comments  – are giving your readers better ways to discuss your ideas and take the conversation to new levels (yes, we’ll also discuss the depths of online conversation, and strategies to avoid the vitriol).

Details

Here’s what you need to know:

Who’s in charge?

Back to the Blog is being organized by Cara Rousseau and Anton Zuiker. We welcome your help – contact us today.

Eventbrite - Back to the Blog Conference

Questions? Contact Cara Rousseau (cara.rousseau@duke.edu) or Anton Zuiker (anton.zuiker@duke.edu)

It’s really a good time to be a blogger.