Week 28 – Learning Activity – Coming Up With a Strategy

For this activity I was asked to complete the following tasks:

  • Set up a meeting with a business owner and ask him/her what he/she would want from a website. Also ask him/her what the business strategy is and how the website would fit into it.
  • Then write a detailed document about this.
  • Use the information from this document and create a website architecture.
  • Focus on the web design strategy. Your document should justify all the major decisions you make – from the domain registration, hosting, design and target audience through to what you decide in terms of programming.

Meeting with a business owner

Before meeting my client I prepared a list of question to ask during the interview as follows:

  • What is the current brand strategy? If not clear, go to the appended side.
  • What is successful or what does the client think works?
  • What is failing?
  • What are the company’s primary values?
  • What messages the company is communicating now? And what should be communicating?

Theses questions are already listed in the Learning Activity – Acquainting yourself with the work process – Week 7 where we went in depth with market strategy.

I also reinforce those question with a post that in my opinion clearly explained  7 questions to ask when developing your brand strategy by Ashley Taylor Anderson, who is the Director of Content at Ceros, New York


The result of the interview that I run parallel to each owner of a graphic production company were the followings:

More coming up!


Website architecture for a a graphic production company

More coming up!


Web design strategy for MA08

Decisions I made about domain registration and hosting.

Originally I had decided to use janaleks.com as the domain was already registered under my name and was previously used for my design journey in WordPress. So I did all the transpassing from WordPress server to One.com and so on.

At the moment it seemed the obvious choice as it was directly link to my persona. However as I will be using this domain for both placing my web portfolio and access to links related to me at a later time; and the fact that the last 50 years of art are not related to me in anyway, it makes more sense to separate and manage the sites on their own. It is there I created the site arte50.com

The name is based on:

  • .com is standard
  • Both names are easy to memorize
  • Short URL
  • Arte50.com; is the final domain for this assignment, because it is directly related to art while 50 stand for the period it covers. Nevertheless during the concept I developed I explain that in the future the site might not be limited to those 4 styles.

 


According to Mapping the Modern Web Design Process by  Morten Rand-Hendriksen he describe the process of web designing as a cycle that once it starts it never ends. However the people involved will be always changing and the sites should always be viewed with 2 ideals:

  • Adopt progressive enhancement
  • Design around content

As people will be always changing it is highly recommended perhaps it is a must to create description of the different process for newcomer to read through and adapt to those pre-established systems.

The process developed as follows:

Pre-process

Here is the point where establishing responsibilities for both for the team members as well as the client is vital.

The client is who most know its company and therefore should provide insights, vision, content and input along the way.

The team members of the design project will also have roles that are that are directly related to their areas of development. However there are isolated roles that should be lead by people outside those environment. These  roles are user experiences, system architect, quality assurance and testing. The reason for this is to ensure that no pre-established judgment is affecting the desired results ie. great information experience by real users or real people.

The team members will establish baseline documentation. This ensure  that the process becomes a second nature to each members of the team or a newcomer or even after a certain period of time; things might me forgotten after a while.

Also establishing version control is important specially when working with projects that may have many parts or when they are very extensive. Through this,  the team may experiment with different approaches and decide which work best but always having the possibility to rollback to a previous version with little effort and time usage.

Once this stage is clear we enter the cycle itself

  1. Planning content strategy
  2. Pre-build testing
  3. Content, design and development  (they run parallel to each other)
  4. Post-build testing
  5. Optimization.
  6. Launch and reset and start again!

Now I will be getting into more details,  while applying those concepts to my site development MA 08 – Interactive Infographics Website.

Planning content strategy

The content strategy is segmented in 5 main areas:

content-strategy-basic

User persona

For this assignment I choose to target high school students from media and communication. My personas are fictional but as I am studying a related subject I try to put myself in the roll  to get as near as possible to a real person as I could. There is a very interesting in depth video that describe how to create personas at lynda.com, UX Design Techniques: Creating Personas by Chris Nodder

I create personality cards that describe each person’s roles, attributes, goals and concerns

ma08-personas-card

I refer to them as my target and front end users and I need to adapt the site to their needs. I go more in depth further on during under the subject: Decisions I made about design and target audience.

Once my character brief is ready I proceed to find them in real life, research how to get in contact with them, what interest them, How they like to see the content displayed , and further in the process test the site and see how they like the structure or if they would come with suggestions or a new structure. This information is also used by the graphic designer to create a visual concept that suits them .

Content audit

After having a clear view of my target persona and collected data. this data needs to be organized, cataloged, grouped and tagged.

Here is when the content audit starts as shown below:

  1. Asset’s role: The main groups of information on a site.
    • In my case:
      • About Ma08
      • Styles
      • Contacts
  2. Content type: identifies whether the asset is a page, text, image, video, or something else.
    • In my case I have:
      • images
      • text
      • links and reference material
      • e-mail
      • social media links.
  3. Given name: the name itself of the asset
  4. Publishing date: Self explanatory
  5. Description: also self explanatory
  6. Relationship: This is how my pages relates to each other for example, About Ma08, Styles and Contacts are level one. However Style has pictures, text and links at level 2
  7. Parent: is the main level all the assets relates to, for example:  Style is the parent at level one that hold pictures, text and links at level 2parent-and-relations_li
  8. Taxonomies: in the dictionary  taxonomy  is “The classification and naming of organisms in an ordered system that is intended to indicate natural relationships, especially evolutionary relationshipshttp://www.thefreedictionary.com/taxonomy. Ie. Taxonomies groups elements. For example for each style I have links and books and they are group accordingly
  9. Content model: is an structure that is based on taxonomies. for example: for my art style page I have pictures, a list for information such as year, artist, a paragraph that describe the art concepts, a bit of history, and then two extra list one with links and other with books that serves as reference material.
  10. Owner: is the person that create the content and responsible for keeping it up to date. In this assignment it is me
  11. Status: It is information about the content and how it stand in relation with its deadlines for example it could tell you if the asset is draft, pending review, published, deleted or moved
  12. URLs: This are the site directions where the content is located, if there is and oldsite been updated then a second list with old URLs would be appended.

Priority and hierarchies

Do you remember when we created the persona? There I wrote that further in the process they would tell us how they would like the structure or if they would come with modification or restructure it. Well here they do that by stacking the information modules by hierarchies according to their needs. When building a site to your client, they must be integrate in this process too.

Information architecture

After having your priorities clear you proceed to make a diagram of your site structure. this will representante how the pieces  interact with each other.

Here how it look for my site:

architecture

Wireframing

Now we are starting to produce layouts and adjusting them to the media. it is irrelevant at this stage to use colours, images or text. What you want to do is present the site for first time to your client but solely in structure.

Here I produce several sketches with different layouts starting on a mobile device because of its small screen and then a pc. Once I inclined for one of those to work with I use a site called wireframe.cc for creating a visual aspect of the site on the fly.

Sketches

This slideshow requires JavaScript.


Decisions I made about design and target audience

As described before I have chosen to target high school students from media and communication.

According to their personalities, they are young  people on their 20’s studying or finishing their careers, interested in technology, social media, wanting to learn more, and trying to apply their knowledge towards a more deeper purpose.

They want facts, have control, a lot is going on on their lives, so they need simple, original and effective solutions  that are consistent and functional. Perhaps they need inspiration to achieve new ideas, new solutions and innovate. all this while looking good.

They believe that  “everything is there for a reason”, “past and present are connected”, and “history may reveal the future”

More coming up!


What I decide in terms of programming.

According to Web Design Fundamentals: Exploring web design by James Williamson  and WordPress Essential Training: Separation of style and content by Morten Rand-Hendriksen a common website is built mainly by using HTML markup language where the content itself lies and hold the site structure, CSS which is a presentation language an has a different syntax code that tell the browser how the content should look, and JavaScript to add interactivity to the site and controlling the behavior of page elements through a script language. JavaScript is not required for websites to display. They would need to be added to each individual page.

I have read and reviewed some courses at lynda.com on that subject and have also cheack the net. After culminating my research I found that many people agree to use a Content Management Systems or CMS like WP for its possibility to edit visual style without affecting the website content.

With CMS there is a clear separation between content and style and it allows  making changes without needing to edit each individual page. The styles in WP is presented and controlled by templates while the content lies on a database

This gives me possibilities to expand the site if it is later required, also allows me to make changes on the fly and even gives my client the possibility of update content themselves without the risk of destroying the site. This is possible under certain rules that I could create.

Therefore I have decided to work with a WP template that I will adjust to my user requirements.

WordPress offer many possibilities but there is not easy acces to edit its core HTML structure,  instead I need to select a template that has all the elements that I need for my site and further adjust them with CSS. A great advantage with WP is that I could then add plugins that contain JavaScript functions without worrying on having to go on depth language  syntax on the run. However it is highly recommended to learn it  as it is becoming more and more a web standard.

I can work in the site live while it is hidden from the public view by going to Settings >> Privacy and change it to “Privat – Your site is only visible to you and users you approve.” How to Hide Your WordPress Site During Development by itxdesign.com

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s