Showing posts with label Blogger. Show all posts
Showing posts with label Blogger. Show all posts

Wednesday, 8 May 2019

How strategic design informed my research blog's 2019 update


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.
As a multi-disciplinary researcher, I also explored how well, or poorly, my label-use linked to my core research interests; 'online identity', 'cultural taste', 'connected learning', 'participatory culture' and 'design strategy'. The analysis (see Figure 2) foregrounded an opportunity for improving the labels I had used and the need to add key labels that were 'missing-in-action'.

Figure 2. travisnoakes.co.za label review
It'll be a lengthy project on its own to simplify them; these labels reflect ten years of history in terms of the varied interests and projects they reflect. A big benefit of doing such work lies in it improving viewers' label search options, whilst helping me to better strategise on the blog's content development.

+3> Plan for publications linked to refined roles and interests

Speaking of which, I have prepared a research publication plan that primarily includes research articles from my PhD, the online academic bullies and mobs project and this blog. Over time, I hope to feature more design-related posts on this blog, plus visual designs. This will create a clear shift with content previously dominated by my PhD research and related techné mentorship concerning e-portfolios.


+4> Reprioritised researcher publications

Another important shift lay in switching the priority of navigation options under my researcher button. Back when I was a PhD candidate, it was most important to get feedback via conferences on my manuscripts and presentations. However, both are near the bottom of a traditional academic publishing hierarchy. Postdoc application requirements reflect this hierarchy in spotlighting emergent scholars' publication of research articles (and/or chapters). My revised navigation reflected this hierarchy by first featuring articles and first chapters. It then provided a link to my thesis' abstract, my conference papers and Slideshare account. Overall, this structure is fairly future-proof, since it is easy to add new research material to and for users to follow.

+5> Improved research blogsite's reliability

Blogger's widget layout system makes it very easy to add functions to one's blog. A downside of adding content from third parties (such as one's researcherID badge...) is that these may not have been tested in Blogger widgets, nor on all browsers. One side effect can be that widgets alter one's layout (... which influenced this blog's body text layout after it exceeded a certain width in Google Chrome). Running Google Chrome error reports also flagged issues with select add-ins. In response, I updated all profile badges and combined them into as few widgets as I could to increase reliability Defunct services, such as my Google+ profile and related pages, were removed. In their place, I added the curatorial accounts of Pinterest and Diigo accounts.

+6> Secured research blogsite with the https protocol
When I started this blog ten years ago, securing it via the https:// protocol was not even a consideration due to the high cost and the technical complexities involved. By contrast, today it is affordable and Internet Service Providers provide FAQs on shifting to https:// protocols that are easy to follow. With assistance from the helpful staff of grid-1.com, transitioning this blog to a secure protocol proved a surprisingly straightforward process that took less than two days from purchase to authorisation and implementation.

I hope this post will inspire others to apply strategic design practices and brand positioning for improving their online research presences. 

Tuesday, 5 July 2016

How to extensively customize your Blogger template with custom-designed, menu buttons etc. @Blogger #gHelp

+ 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.
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.

Saturday, 27 December 2008

The Travis Noakes blog's disclaimer

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
This blog does not have any promoters or sponsors and is fully-owned and operated by its author. The author of the Travis Noakes blog cannot guarantee the availability of the blog. It is hosted on Blogger and the availability of this blog is therefor subject to both Blogger and Google's Terms of Service.

13. Automated advertising
The automated advertisements featured on this blog are provided via Google Adsense and are governed by its terms and conditions. Adverts may be personalised since the Travis Noakes blog supports Google Ads personalisation.
  
14. Nofollow tag
All links given to commercial websites will carry rel=”nofollow” tag, for the fear that Google will interpret them as sponsored posts and may choose to penalize the author. Please be informed that the author does not do any sponsored posting on this blog and articles/links on commercial websites are given because the author finds them relevant/interesting/useful to readers. Links given to personal pages and blogs do not carry nofollow tag, except in exceptional cases where the author feels the need for same.

15. Adding comments
Readers are encouraged to challenge the author's ideas in the comments section of each blog entry. Please note that the author reserves the right to delete any comment for any reason whatsoever. In particular, comments that are abusive, profane, rude, spammy or off-the-topic will be removed. Kindly note that no comments published to this blog are endorsed by its author.

Credit
* My blog's disclaimer is based on eNidhi India-Blog's Disclaimer at enidhi.net/2007/06/enidhi-india-blog-disclaimer.

Total pageviews since 2008's launch =

+ TRANSLATE

> Translate posts into your preferred language

+ SEARCH

> Search travisnoakes.co.za

+ or search by labels (keywords)

research (58) education (43) design (22) nvivo (16) multimodal (9) visual culture (4)

+ or search blogposts by date

+ FOLLOW
+ RELATED ONLINE PRESENCES

> Tweets

> Kudos

> ResearchGate profile
Articles + chapters

> Web of Science


> Social bookmarks + Edublogs listing
diigo education pioneer Find this blog in the education blogs directory

> Pinterest
> Create With Pinterest