Written for researchers interested in using design strategy and brand positioning for improving their online research presences (particularly via blogs, blogsites and websites).
Last year, Jon Whelan and I updated this blogsite to prepare for my post-doctoral reality as a media studies research fellow, who can contribute to scholarly publications and pursue new research opportunities. By contrast to our previous work focused on Blogger customisation in 2016, the latest design process was largely a strategic one. It drew strongly on insights from brand positioning, plus design strategy more broadly, for my blogsite's improvements:

A. Why Strategic Design?
Table 1. High-, mid- and practice level design disciplines.

HL  Design Management (i.e. brand & software & service design mx)

HL  Strategic Design (i.e. data analysis informing brand positioning)

ML  Design Thinking (meta-disciplinary)

PL   Surface design

PL   Brand design management

PL   User-centred and experience design

PL   Software and information design

PL   Service design management

PL   Curricular and instructional design

PL   Legal design

PL   Business design management

As Table 1 illustrates, the disciplines of Strategic Design and Design Management are high level (HL) strategic ones. In business, these disciplines typically seek to define and improve the long-term, 'meta' design drivers. By contrast, Design Thinking is a mid-level (ML) meta-disciplinary approach that often seeks to tackle a ‘wicked problem’ space with varied perspectives in a short burst. At the bottom of the table are performance level (PL) practices whose designers' expertise is used for providing discrete, 'micro' solutions.

For an individual blog designer, strategic design considerations may be particularly helpful for answering a big personal challenge. For example, mine was 'How do I update my research blogsite to best support my post-PhD aspirations?' To answer this, I did a strategic design process that included data analysis, a review of my personal branding plus identity development exercises. These informed my creative brief to Jon, plus the ongoing development of this blogsite.

To improve my blog's usability and personal salience, I made the following design changes:
  +1> My roles were simplified;
  +2> I checked how each role and my research interests were reflected in my labels;
  +3> My publication plan addresses my diverse roles and interests;
  +4> I reordered my 'research' navigation to support the postdoctoral publication hierarchy;
  +5> I also took other measures for improved reliability;
  +6> plus security.

+1> Refined my personal brand positioning and roles
Online spaces can provide ready opportunities for individuals to experiment with digital personas. As part of my PhD's broader identity exploration project, my blog featured five roles in its navigation. These were 'researcher', 'designer', 'educator', 'public speaker' and 'volunteer'.

While accurate in terms of identity exploration as a PhD candidate, it made for a complex and potentially confusing navigation structure on the mobile phone (see left in Figure 1). It also seemed important to simplify identities to reduce that inevitable 'he's a jack-of-all-trades' perception!

Figure 1. travisnoakes.co.za navigations (version 2016 vs 2019) in mobile screen by Jon Wheelan, 2019.

To solve both challenges, I did an exercise for simplifying my identity by clearly defining the three roles I prefer to do. Such consolidation also supports a simpler overall online persona that is easier to keep coherent (i.e. I might describe the same roles on; LinkedIn for work, academic portals for research; Twitter micro-blogging or Facebook for friends). My roles were prioritised down to the big three of: 'researcher', 'design steward' and 'techné mentor'. Interestingly, researching design strategy introduced me to the unusual 'design steward' and 'techné mentor' roles: The former reflected how my career in design increasingly involved briefing designers and sharing their work, versus my own designs. As a ‘techné mentor’, I am involved in fluid, once-off educational interventions related to technology. My previous roles (such as speaker and volunteer) proved easy to re-house under the simpler navigation (see right in Figure 1).

+2> Checked that my Postdoctoral roles and interests are covered in Blogger labels
I've tried to make my blog easy to search by using Blogger 'labels' for each of its posts. By analysing my use of labels and how these relate to my roles, I learnt that there were far more articles that related to my role as a techné mentor, than as a researcher or design steward.

+ Written for Blogger users who want a high-level introduction to extensively customizing their template. This includes adding custom-designed navigation menu buttons. I couldn’t find an FAQ topic addressing this topic anywhere on the web, so here’s a post to help close this gap :
This high-level ‘how-to’ is written as an interview between Jonathan Whelan (this blog’s designer and template coder) and I (his Blogger-using client). We cover the why’s and how’s of my old blogs’ custom template’s look-and-feel being completely reworked to look and function impressively. This includes the process he followed for adding custom-designed buttons to the navigation menu of a basic Blogger template.

Image 1. www.travisnoakes.co.za in Macbook, May, 2016. Adobe Photoshop by Jon Whelan.

Travis: This custom Blogger template that I last edited in 2009 had become way past its use-by date. It looks jurassic compared to contemporary layouts. It also did not work well on mobile phones, while its custom code seemed to obstruct Google’s add-in gadgets for social network sharing. Being close to finishing my thesis’ full draft, I wanted its design to reflect my aspirations for it as a ‘post-PhD’ blogsite. The new, next-level up, look-and-feel also needed to reflect broader personas than a ‘researcher’s blog’ could. It took a while to decide on a graphic metaphor that resonated with my different roles, but I eventually came up with the idea of a ‘plus’ sign. This suggests how each individual combines and expresses varied personas - a key focus of my PhD {The nerdy humorist in me also hopes that geeks will appreciate its tangential nod to ‘Google Plus’ ;) }. In my life, the roles of Researcher, Educator, Design Thinker, User, Speaker and Volunteer have become the most salient. So, I sketched some icon ideas for these pluses. These were incorporated into a creative brief (see travisnoakes.co.za look-and-feel update brief 2016), for Jon to quote on.

Jon: Being a graphic design professional, it was easy for me to rework the plus icon ideas into versions that would look good even at a small mobile phone screen scale.

Image 2. New button icon designs for www.travisnoakes.co.za, June, 2016. Adobe Illustrator by Jon Whelan.

Travis: Yes, it’s very easy to ignore these users when enjoying these designs on a wide, monitor screen in the office.

Jon: Right. For me another conversion issue was becoming familiar with how Blogger organises pages and add-ins, versus how Wordpress CMS supports in-depth design customisation. The way a Blogger theme is built is slightly different and it took some learning from my side appreciate how it applies html and css: Blogger themes are structured in sections and built out of widgets/gadgets. With this in mind, I proposed building the theme from the ground up to be more efficient than hacking a free or a paid-for one.

Travis: That proved the right way to go. Compared to WordPress, Blogger seems not to offer the same level of template customisation and control. This probably contributes to why Blogger seems not be as widely used as WordPress by Capetonian designers or academics. Nevertheless, I was not keen to shift to a Wordpress blog. I am pleased at my blogsite's search engine recognition, especially for its niche subject-matter. I also like Blogger’s ease-of-use and not having to worry about back-end maintenance, such as updating it. I was hoping to benefit from the multi-device compatible (mobile and tablet) publishing and fast page download speeds it provides. Then there’s the Google translate widget, which allows viewers to select their preferred language translation of a post. I’m especially happy that this makes it easy for its e-portfolio lessons to be viewed in Afrikaans, Sesotho, Xhosa and Zulu. I enjoy the live internet traffic stats that Blogger shows too. And its easy integration with Google Adsense has taught me how difficult it is for niche bloggers to cover one’s hosting fees. The unfortunate side effect of my Blogger fanboy-ness was Jon having to attend a crash-course at “Blogger University” ;) ...

Jon: True. I think that most locals also use WordPress, because it is extensible, easy to customise and manage. By contrast, Blogger has limitations with regard to adding custom features. My jump into Blogger’s “deep-end” proved daunting, given the tight deadline I was working towards and needing to follow a ‘site design and build method’ comprising wireframe-, mockup-, code- and testing phases. The wireframe was easy to mock up into two draft .html mockups for button varieties one and two. However, there were several stumbling blocks that needed to be overcome before the chosen design could be implemented in Blogger.

Travis: Correcting my ‘plus’ symbol ideas that might be perceived as medical or religious was a breeze in comparison?

Jon: Sometimes over-using the plus symbol seemed to take away from the simplicity that we wanted. Also, I spent quite a while reworking the icons to make sure their quality will not deteriorate as they scale down. The simplified design of the buttons was done to suit Google’s Material standards. Although quite literal, the new buttons’ advantages were that they quickly communicated what they were about. Once you had chosen a combination of icons from both sites, I broke up the html from the test sites. These were added to Blogger widgets in my test blogsite’s basic template. Only once I was confident that the template actually worked, was I then prepared to apply it to Travis’ live blogsite.

Travis: You made several backups and I was very happy that you didn’t need to use them. Another plan B was contracting freelance Blogger experts via upwork.com, such as Prayag Verma or Nicholas P. Both had many positive reviews in what seems to be a niche area of expertise.

Jon: It took a while to figure out ways in which the site could work like Travis originally wanted it to. For example, there was no online ‘how to’ on linking designed buttons from a navigation menu. I worked out that I could use a widget for writing html and css to address this potential showstopper. Travis gave me access to the CPanel service for his webhost’s domain. I needed to store the icon images in the domain, and link the images to his blog. This allowed me to add links from the button images to old and new pages, or addresses pointing to a label query (i.e. http://www.travisnoakes.co.za/search/label/design_thinking).

Travis: There was a minor technical delay before Jon could put this into practice. After trying to login unsuccessfully to the CPanel address, I logged a support ticket. The upshot was that we needed to wait for my webhost to activate the CPanel’s functionality and for my new access details to work. Hopefully our readers are now forewarned to check with their webhost and set up domain access early on. Do not confuse such access with their basic hosting account, like I did.

Jon: In working on the navigation menu widget, I also discovered that by removing the skin, I know it sounds painful, I could style the design better. I then did another iteration of the site to show what a possible working prototype would look like. I preferred to do this, so that the icons could be viewed from the user's perspective. This also helps me in my design process as I can see how it works online as opposed to a nice A4 printed presentation.

Travis: Yes, it was reassuring for me as the client to see a working prototype before the migration.

Jon: Then when it was time to do the transfer. I backed up the old site before I did anything. I organised his redirect page as I started applying the new look-and-feel, so that visitors to the site would not have access to the "renovations" and get a teaser of the imminent update.
Travis: While you were doing this, I could also log into Blogger and see the site running the new template. Jon used all the gadgets from its previous version and I could see this still running, which was neat.

Jon: Yes, I also refined the desktop navigation icons, which were center aligned to take up less space. I added a page to link to each button and checked the 'plus' favicon' was visible. The pageviews were still 95,867, as they were. All the other elements were there. I hardcoded a social media links tab to appear in each post… The reason I hardcoded the social media icons was to ensure the look and feel was consistent with the rest of the theme, the icons and also because there weren't any gadgets available to meet our needs. For the Adsense gadget, I just changed the sidebar one to be 'responsive' to make it look better on mobile.

Travis: On that, my blog’s appearance on mobile is light-years from where it was.

Jon: The desktop too, as we can see in my images.

Image 3. www.travisnoakes.co.za, viewed via iPhone, June, 2016. Adobe Photoshop by Jon Whelan.

Image 4. www.travisnoakes.co.za viewed via desktop browser, June, 2016. Adobe Photoshop by Jon Whelan.

Travis: I hope our chat has given Bloggers insight into an approach they might follow to extensively customise their blogs’ ‘look and feel’.

Jon: Yes, and if you need in-depth help, please contact me via http://www.jonathanwhelan.com/contact-jonathan-whelan.

Travis: And if you have any suggestions or concerns, please add a comment below, ta.

Written for academic researchers interested in improving their online presence.

Late last year, Laura Czerniewicz worked with Kelsey Wiens and I to review and improve Laura's online presence. This process involved three phases:

1. First, we audited her current online presences;
2. Second, we defined what she would like achieved;
3. Third, we actioned the most important aspects of this by developing her online presence guidelines and implementing a plan for each presence.

1 Audit of her current presence.
Searching for Laura online using the most common search engines (Google, Bing. et al.) showed her Twitter account, old UCT blog and a profile on CET's website. It also revealed that a few of her presentations had been uploaded to Slideshare by other people and an index of her research articles had been automatically generated on Academia.edu. This followed her publishing a profile there (and "forgetting about it, while it developed a life of its own" as she says). The latter was an example of a digital shadow; where an index of articles she had submitted to diverse journals over several years was dynamically created by an online service after her initial contribution.

@Czernie on Academia.edu (11 January, 2012)

2 Defining what she would like achieved.
The results of this audit were then combined with ideas on opportunities she could action to improve her digital identity's footprint (which she can pro-actively manage versus a digital shadow that is often a passive reflection of activities) in her online presence plan (generic version).

The most important aim Laura emphasised was that "coherence" should be achieved between her varied professional online presences. To achieve coherence, we developed a set of guidelines for her online identity. This covered; her name, personal and profile descriptions, tagline and the researcher keywords she would try to consistently use for her identity across all her presences.

Another important aim was improve the online visibility of her scholarly output. To support this, she committed to having an active online presence in the following areas; creating and publishing her academic profile and CV, blogging regularly, uploading showcase presentations, publishing micro-updates, sharing social bookmarks and submitting her blog's details to online directories and blog aggregators:

We had a in-depth discussion about the extent to which her professional identity should include a personal dimension. While I felt that she should include a personal hobby, she believes her online identity should be purely professional. Although we limited her presences to her academic and professional side, I still think that this is a pity; it limits the opportunity of her profile's viewers to understand her passion for craft and design and potentially discuss this with her...

Laura was very busy; even though she was very committed, she struggled to find time to fit this new project between her existing activities. An example of this was when I wrote the first draft of her identity's profile; Laura was very insistent that she should own her profile and re-wrote it. As a rule, I learnt that this is one task a post-graduate student should not be handed! Another challenge posed by Laura's time scarcity is that academia.edu indexed, but did not provide access to original documents. I'm hoping that Laura can find the time to upload these herself, despite it not currently being a high priority.


Presentation presence
Slideshare is a popular service for academics, and others, to share presentations. Laura had created an account long ago, but had forgotten her username since she had not been using it regularly. She was also concerned that previous uploads of her presentations were poorly tagged and hard to search for. To help, her http://www.slideshare.net/laura_Cz account's profile was improved and she uploaded recent presentations to it. She was pleasantly suprised when a presentation on Academic Visibility reached over 6,000 views, following it being featured on Slideshare's homepage!

Stats for this presentation on Slideshare.net (8 February, 2012)

Microblogging presence
For microblogging, Laura enjoys using Twitter and only tweets in her professional capacity. We had an interesting discussion on the extent of Laura's tweets and Kelsey suggested that a small percentage of these might feature personal interests. Laura has yet to be sold on the idea, however.

Social bookmarking presence
Laura started using Delicious at a time when it had huge news coverage because of the ownership change. She took the initiative to link her Twitter account to Delicious, which now automatically saves interesting URLs directly from her Twitter account.

Online directories and blog aggregation presence
Laura's blog was submitted to the Open Directory Project to improve its visibility. A blog aggregator, Amatomu, is next on Laura's list.

Other negotiations and considerations
Across all these services, the personal and professional line in social media was debated. While Laura is insistent that there is a clear line between the two (i.e. LinkedIn is for professional use, Facebook is personal), there are other UCT academics who use them (especially Facebook) as a joint space. It will be interesting to see whether Laura's views change...

The list of services above is a shortlist from what was considered and it was important for us to negotiate around the "lots that you can do" versus what is feasible. In particular, we defined the minimum that Laura was prepared to do for achieving her objectives.

As a busy academic, Laura also has a low tolerance for technical failure. In choosing services, we had to make sure they were easy-to-use and dependable; Laura would not spend time troubleshooting. Having clearly defined the low hanging fruit and most appropriate online services for Laura to use, we finished defining her online presence plan: each online publication she wanted was listed and a list of tasks and deadlines was defined for each.

For South African bloggers who want to share their bookmarks.

To provide my blog's readers with the opportunity to check-out sites I like, I set-up my Delicious account today and added its widgets to my blog. Although it seemed simple, it took over 3 hours to get the foundation right:

1 Importing all my bookmarks into Delicious from Safari was easy: 10 minutes, tops.

2 Sharing useful bookmarks took about an hour, as it took me a while to work out that a 'Bulk Edit Beta' option existed... DOH!

3 Delicious used my Safari bookmarks folder structure to generate most two-word (and more) tags. Most of these are not relevant to my blog's readers (much as I'd love to share my bank's details or fireplace choices with you ;)), so removing these redundant tags was the next step. It's a three-step process to remove each tag, though. As Charlie Brown says, 'AAAUUUGH!' That was another hour; going, going, gone.

4 Adding the widgets, testing them on Safari and Firefox and refining them took another twenty minutes.

Anyway, it's done and I'm interested if you think it's been worth the effort? Post and let me know :)!

P.S. If you're on Delicious and like this blog, please add me to your network. Ta.

A legal disclaimer for this blog that covers all its readers, such as you!

All content on the Travis Noakes blog is governed by these policies*.

1. Copyright
All content published in this blog is the intellectual property of Dr Travis Noakes (the author) and should not be reproduced or copied without permission and/or without giving credit.

2. Attribution
Contents/images/information sourced from external sources are given due credit, wherever possible/necessary.

3. Copyright concerns
If you have any copyright-related issues with the author's blog's content, please add a comment to the relevant post (with all necessary evidence, if applicable). Such concerns will be given all due consideration and addressed as early by the author as he can.

4. Proprietary information of third parties
Company names, trademarks, logos and other proprietary information quoted in this blog are the property of respective companies/owners and are mentioned here for reference purpose only.

5. Personal opinion
Opinions/viewpoints expressed in this blog are entirely personal to the author. His clients, relatives, family and friends have nothing to do with these contents and are not liable for anything whatsoever.

6. Privacy protection
Every precaution is taken to protect third-party identity. If you name/photo has appeared in this blog and you wish to get it removed, do let the author know by contacting him.

7. Waiver
The information in this blog is provided “AS IS” with no warranties, and confers no rights. While every caution has been taken to provide the author's readers with the most accurate information and honest analysis, please use your discretion before taking any decisions based on this blog's information. The author will not compensate you in any way whatsoever if you ever happen to suffer a loss/inconvenience/damage because of/while making use of information in this blog.

8. Blog corrections are ongoing
The author may keep updating old posts on a regular basis and is not bound to explicitly state all corrections made. Regular visitors/email subscribers are likely to miss these updates and are urged to check back, whenever relevant.

9. Requests
The author currently has no commercial interest in blogging and may not accept certain types of invitations/requests which he deems inappropriate.

10. Links
The author is open for link exchange, but such requests will be entertained on a case-by-case basis at the author's sole discretion.

11. New posts and updates
Blogging is not a primary activity for him and new posts may get delayed if his primary activities demand it. Your patience in these circumstances is appreciated.

12. Availability of this blog