#STYLECHALLENGE: Navigation

From the very start of my remediation project, it was a goal of mine to incorporate the “journey”/”travel” feel that my repurposing project consisted of. After deciding to create a website for my remediation project, however, I knew this would be a bit more difficult than it was for a magazine spread. How was I going to incorporate this journey/travel aura on a multi-page website? I needed to find a way to string all my pages together, in a way that would allow the users of my site to feel as though they were traveling to different places in the world.

After meeting with Professor Silver, she gave me great insight into how to fix this problem. Instead of simply having a menu at the side of my site with different tabs, I figured out how to link the different pages under particular tabs together. For example, one of my tabs is a review of different restaurants in Ann Arbor that serve unique and tasty salsas. When you click on the tab, which is called “HOT” SPOTS, you are taken to an introductory page about Ann Arbor in general, and how it houses many Mexican restaurants. Then, instead of putting information about the three restaurants I chose to include (Isalita, BTB Cantina, and Chipotle) all on that same introductory page, I created hyperlinks that takes users to separate pages, each with information on just one of the restaurants. This also solved the problem of having too much text on a single page. The “HOT” SPOTS page now looks like this (the red words are the links):

Screen Shot 2013-11-22 at 4.39.38 PM

In addition, Professor Silver also mentioned that instead of forcing users to click on the tab menu each time they wanted to get back to the introductory page or read about a different restaurant, that I should string the pages together. At the bottom of each page, I put a link/button to help users navigate through, or “travel” to the next restaurant. This way, they can move back to the previous page they were on, or move ahead to the next page, without having to go back to the introductory “HOT” SPOTS page and search for the link for the restaurant they want to read about. An example of this new style feature on my site looks like this (the links are in yellow):

Screen Shot 2013-11-22 at 4.43.40 PM

#StyleChallenge Becomes A #TechChallenge Because Of Course

For my #StyleChallenge, I decided to present my public health papers as a self-created public health journal of sorts. I Googled (of course) online magazine editors and stumbled across MadMagz. I found it simple enough to use, and there were a lot of layout options. Some downfalls were that the layouts were pretty much set in stone once selected and after many pages it was hard to be creative with them.

The cover page of my magazine.
The cover page of my magazine.

Creating the magazine took quite a bit of time, so when I completed it I was very excited to code it into WordPress. This #stylechallenge, however, became a bit of a #techchallenge at this point. As per usual, my tech savvy dreams were dashed because wordpress.com does not allow you to insert codes with “embed” or “iframe” etc. into their site. Go figure. My code:

 

<code><p><iframe src=”http://madmagz.com/magazine/embed/265190?layout=1&amp;width=400″ width=”400″ height=”565″ scrolling=”no” frameborder=”0″></iframe><p>A mag created with <a href=”http://madmagz.com/?utm_source=publisher&amp;utm_medium=embed&amp;utm_campaign=viewer”>Madmagz</a>.</p></code>

 

Ugh… So I had to settle for taking screenshots of the pages, inserting them into a slideshow, and then offering a link that leads to an external page with my magazine, which can be seen here.

Pros: I learned how to create a magazine, how to produce a slideshow on WordPress, and a bit more about coding.

Cons: My original vision wasn’t possible due to the blog host I had chosen, leading to a lot of frustration and annoyance.

Has anyone else had a moment like this?

 

 

#StyleChallenge – Whitespace

While researching graphic design and website layout principles, I found white space to be a common, positive element. I am trying to make use of this principle in my Remediation project, for which I am creating a Tumblr.

The challenge comes in with finding a layout that has the desired white space, but that will also accommodate my content.

My current layout uses a plain white background with three columns across. There is plenty of space around each post. And, captions are kept close to their accompanying images so readers can tell they are supposed to go together (in some themes I looked at, there was too much white space between photos and their captions). Also, being able to see multiple images at a time will keep the reader scrolling down.

There is one main problem, however, with fitting a theme to my content: animation.

I am using a lot of animation in the images for this project. Seeing multiple things move at once can distract a viewer, which defeats the purpose of focusing on white space. I am trying to alternate animated and non-animated posts, but this has not always been easy because I want to lay out my argument in a certain order.

Does anyone have tips for balancing space and animation? Am I the only one who thinks multiple moving images are distracting, or do other people feel this way, too?

Colors and Fonts — Such Fun!

The style that I was interested in looking at for my re-mediation project was the different ways that color and font play a role in creating an interesting project.  I really never thought about these two features as being a big part of a presentation — I’d just pick one that I thought was nice looking.  After watching the Lynda.com tutorial on presentations that was on C-Tools, I thought it was really interesting and enlightening to think about these features in the context of the audience!  Before, while I was in the beginning stages of my prezi I had a standard Times New Roman font that looked professional (and admittedly plain).  Now, I drastically changed my first draft from a plain prezi made from scratch to one which has a basic template — and a fun new font.  See the picture below!

Font for my Re-Mediation Project
New font/template for my Re-Mediation Project

Because my audience is college freshmen, I thought a Blackboard template would be fitting for this sort of project.  Also, the font is WAY more engaging that boring Times New Roman, or anything like that.  As for the colors, they work together in a way that I think is simple, yet effective — which is really what I’m going for.  On Lynda.com they suggested some really “out-there” color palettes that I think draw people away from the content and more towards the aesthetics.  I hope that with the colors that I picked (black, white, yellow, etc.) these hypothetical students will be interested in what is being presented and stay engaged as well.  Overall, the tutorial on Lynda.com gave me a lot more to think about than I first thought possible!  I hope it turns out as good as I want it to!

 

Color Theory #StyleChallenge

My Re-mediation project is extremely visual so I thought I would look into color, because while my photos will and should be the focus of my ads, the background color and text color can be just as important in influencing viewers’ responses to and opinions of an ad. I came upon an article on coloring meaning and psychology on Squidoo and it was extremely interesting and informative.

Some colors that I think will be useful and I plan on employing are blue, grey, and red. Blue is often viewed as trustworthy, dependable, and committed. It is the least gender specific color and has equal appeal to both men and women. Grey is the color of intellect, knowledge, and wisdom and many designers recommend it as a background color due to its neutrality. It is controlled and carries authority. Red is a powerful stimulant and can evoke enthusiasm. It is inherently exciting, draws attention, and encourages action and confidence, though too much may be overpowering and evoke negative emotions, such as anger. These colors cover most of the positive emotions I hope to get out of people who look at my ads.

I also read about the importance of balance between image and text (which we all know from personal experience with media), but I think balance between colors is extremely important as well. I obviously don’t too much of one color, but I don’t want to include every color possible. The colors need to interact positively while still appearing visually pleasing, so I’m playing with different hues of these colors to see which combinations work best with the tones of my photos.

Prezi gives me motion sickness #stylechallenge

A big part of my Cosmopolitan presentation is the ending product of the new refurbished magazine. I want to convey to my editors, and owners of the magazine, that my idea will work and enhances the magazine. I had originally planned on zooming in on different components of the magazine to finally reveal the new magazine for 2014. My issue right now is how much is too much motion? I want to make sure people are not too dizzy watching it, but will this take away from my desired look at the end if I put all my data at the end? Here is one where you will zoom in on the history of Helen Gurley Brown (the reason Cosmo is the way it is today), but I am unsure if this jumping around is too much motion.

000a

There’s Helen, so tiny!

Also.

In light of dizziness, I am also working on inserting a video into my prezi. In my previous post I learned how to insert the link and it would pop up automatically with the thumbnail on the screen. What I was still unsure about was how to show my Audrey Hepburn video

00a

 

 

 

http://www.youtube.com/watch?v=Efq9_0j8HI0#t=0m18s

I have always wanted to know how to do that and I finally figured it out-another easy fix I never knew. I wanted the roller coaster to start on a specific time, and I did it!

Now onto Audrey’s interview

 

#StyleChallenge – Pinterest for Business

Finding a Pinterest best practice guide led me to a lot of different “Pinterest for Business” guides. The best one that I found was put out by the company themselves and can be found here.

After getting through the basics of Pinterest (what it is, how it works, etc.) I found a few helpful hints. The first one that I thought about using was adding a Pin It button to the site sponsoring the boards. I hadn’t thought about this, but I think when I edit my Re-Purposing project I will add this to the site so that my Re-Purposing and my Re-Mediating sites are linked.

Screen Shot 2013-11-14 at 2.15.33 PM

The rest of the style guide just included a bunch of helpful hints. I’ve created some goals that I think will make my page more popular and will enhance my project.

1. Pin to at least three boards each day (this will remind my followers each day about my boards and help them explore the rest of my page).

2. Add pins from others (so many people pin about internship opportunities and tips, something that I discovered after reading this practice guide).

3. Add thoughtful descriptions (instead of just listing the organization where internships are available, I am writing a bit about what interns can expect to do if they participate in that internship).

Screen Shot 2013-11-14 at 2.15.57 PM

To all of my fellow Pinterest pals, happy pinning!

Twitter Style

For my remediation project, I’m working on creating a successful, anonymous advice twitter. In the beginning, I thought that all it would take was for me to tweet a lot about a certain topic. After researching advice for twitters in class today, I have realized that the style or vibe that I give off in my twitter is something of importance.

Community. It’s a word you don’t often think about when typing on a keyboard to a cold screen. However, being active in the community your twitter applies to is an important factor in being an advice/anonymous twitter. Nobody wants to read what you have to say all of the time.

So while I have worked on my own content, today I have worked on my interaction with other twitters as well. I’ve followed twitters that are for fashion, writing, business, advice and recently found a few that are aimed towards  young professionals. Most of the young professional twitters I found are area specific and more about a certain job type or city, but I think they will be great to connect with.

So while my design challenge isn’t exactly like everyone else’s, I’ve challenged myself to do research and learn how to be a successful twitter. The main goal I have is to be an extrovert online, seems contradictory huh? But I’ve learned its important to be interactive with the community so I’m going to challenge myself to change my style in that way.

 

Here’s the link to the site where I got most of my advice: http://www.blackbeardesign.com/10-tips-for-twitter-success/

Jumping Off the Deep End

I started a blog. I am both extremely nervous and extremely excited.

Screen Shot 2013-11-07 at 11.35.42 PM

 

The blog focuses on my list of 101 things that I want to accomplish in 1001 days. I created the list a few months ago, and my end date is about 9 months after graduation. Things on the list include running a half marathon, reading all of Jane Austen’s novels, getting a job, and smaller tasks like sending notes to mentors and taking a spin class.

Fears: 

Will I keep it up long term or will I lose interest and disappoint myself?

Will anyone care?

Do I care if anyone reads it besides myself?

Is it worth my while?

How will I feel looking back at this in a few years?

Am I comfortable going outside my comfort zone?

What if I don’t accomplish everything? Does that make me a failure?

Do I have time for this?

 

Excitements:

It’s a creative space that is all my own.

It will make me work towards my goals and see all of my progress.

I’ll have to jump out of my comfort zone a lot (positive and negative!).

I can learn more about WordPress in the process.

It will force me to write a little bit each week.

I can have so many amazing experiences if I follow my list.

 

For now, I am keeping the blog private, but I plan on linking it to my e-Portfolio and sharing it with you all by the end of the semester – eep!

Does anyone else have a blog or am I totally alone here?