Friday, March 30, 2012

Week 9: Restarting

So this past weekend and week was slightly brutal due to how much time left is in this project and how far I am along with it. After I blogged last week, I finally presented my midterm presentation. A lot of it wasn't working so I scrapped it and basically started over, even rethinking how the system works. Therefore, it went from and iPad penpal set up to a hub community. Below is how the system would work:
  • Create profile/information
  • Input own posts under the five categories and tagging them
  • Connect with others around the world through a match system (optional, don't need if don't want)
  • Share imagery, context, and personal testimonies
That's just a little rundown, it would make more sense once you read the scenarios. So they are:

Scenario 1 – profile setup
  1. Welcome screen allowing user to choose own language/flag
  2. Prompted to sign up through a form or sign in (if on another’s computer) on top corner
  3. Input all basic profile specs (like age, sex, name, email, username, password, etc.)
  4. Next screen inputs customization like interested topics, countries, profile settings, and custom colors/background
  5. Save
Scenario 2 – exploring music through categories (in particular, Korean music)
  1. On site – click onto categories where it shows the five (food, music, traditions, social norms, and landmarks)
  2. Clicks onto music – shows new playlists and popular playlists
  3. Can sort by countries, popularity, newest, etc.
  4. Clicks on sort by countries – selects S. Korea
  5. Page shows ONE playlists that pulled music from all users
  6. For each song – shows title, artist, user who shared it, and a link to go to the original playlist it was part of
  7. User listens to several songs and really likes one, clicks onto that song to view more information (that the other user could’ve possibly input or not; could say things like song’s achievements in the country or background information about the artist (could be pulled from the internet instead of user input))
  8. Post a comment saying “great choice! Here’s something you might like then”
  9. Post and end
Scenario 3 – connects with one user from China to ask landmarks to visit and does further research on the site
  1. On site – clicks onto “connect” link to be assigned to someone
  2. Chooses options like countries, age range, and sex, and chooses option to view only online people or everyone including offline people
  3. Connects with a Chinese girl with similar age range that is online (clicks connect) – assigned by the website based on users interest and ratings given by others that has connected with her)
  4. Sees her posts and starts a chat by clicking an icon button near her profile image/name
  5. Ask/talk about landmarks and where to go (girl suggests one near her town/ones she’s been to)
  6. Finishes conversation and ends it – decides on researching more about the place
  7. Goes to search bar and types in location
  8. Search shows other’s posts with the name tagged
  9. Users saves several post to her own collection under her categories
Scenario 4 - TBD

I want the fourth one to deal with food somehow, but now I don't know if I will have three or four scenarios (this is based on if I have time or not). I would like to have four but we shall see. After rethinking, I went ahead and started designing for the web. It's not much different from the iPad but it's totally different. I had the below design as a first draft. Obviously it isn't designed because I was more thinking about how it could function. The first screen users would see is this homepage. They can choose their language and where they are living. It also have the sign in option on top in case the users has already filled this out.
The next image is just to show hover and click stage. Hovering on the language highlights them and selecting it would make it bold. On the flags, hovering would result in an overlay with the name on top. When the user clicks on it, the site goes straight into the registration page.
Which is the image below. They would be prompted the fill out the following and that would take them to a page to fill out interests and so forth. The language and the flag is available on top, in case they ever want to change it again.
So my next step was to make things sexy. Below are the same screens but more designed.
The options are now drop down menus, which the image below shows. It also shows hover state of links like the sign in and the go. 
Once users select language and country, registration screen. The line of links at the bottom near the title changes accordingly. Like above it has the sign in link but below, it acts as an indicator on where the user is in signing up for this.
It might be small but I also changed the language to be more carefree and like the website is talking to the users, so things like "ok, cool. let's get you registered then..." The only thing I'm currently worried about is how links work, like hover states and static state. I also realized I forgot about having the language and country always present for them to change if wanted, but maybe that comes in when they are in the actual site.

So that's where I'm at in this week. I need to really start cracking now that I only have a week left and I feel like I have a form that I like and love and can work around. The title still might change because I'm not sure how I feel about it yet.

Friday, March 23, 2012

Week 8: Designing Scenarios

Spring break was a good week away from designing. Since midterm, I've continued on with my design of my scenarios. I designed a second scenario (or rather half) before I decided that I wasn't feeling the design so much. Therefore, I changed it.

Below is the second scenario before I stopped to redesign the first one (which I will show below). It is suppose to be connecting with a penpal and viewing their music. So it starts off with the user on the penpal "tab" and having the option to explore first or commit to another user.
This particular user, Claire, wants to commit so she taps on "let's do it" and selects a country.
Under the countries are names that are matched with her. I added the sex in so that she knows first off but I've been thinking bout adding the age as well. I don't know how important it is.
This was when I stopped with this scenario and just looked at the design in general. I wasn't loving it since it seems really old and dark and boring. So I just scrapped the colors and restarted my first scenario of setting up the profile.
I like it a lot more since it looks "lighter" and not so dark. I'm not quite sold on the map yet but that could be worked on later. The colors I am liking a lot better but the blue seems off. I want a "pop" color, just not sure what it is yet.

As I keep designing, I keep encountering problems that still need to be solved, like how does the user customize what other see (i.e. music playlists, favorite foods, customs and traditions, etc.). I decided that it would be through "categories" but there should also be a button in the profile to set that up as well (which I will add later). Just these little things keep popping up so I will keep on adding them as I go along.

I wasn't in class for midterm presentation so I'm unsure what people think of my design right now so hopefully when I present, I will get good criticism back and be able to go full steam forward with my design. I've just been in this state where I don't want to continue on if it's just going to get changed. So I don't know, it's just been a bleh state to be in. There's only two more weeks of designing before animating/presentation making goes into production and I have four scenarios total, so a lot of designing and focusing will be happening.

Friday, March 9, 2012

Week 7: Midterm

It's already midterm! Below is my presentation for reviewing progress and where I am at.
DGP Midterm Presentation

Since last time, I've totally revised my formal aesthetics. I needed the imagery to reflect the concept, which my previous design did not show. I'm still trying to not brand it but it's getting a bit harder now since I'm further into the process. I finished creating the profile setup so my next step is to design the other three scenarios. They are a bit more extensive so I would like to get as much formally decided now than later, when it would be more back tracking to go back and change, but we shall see.
The presentation has a better general/in depth view of where I'm at and where I am going.

Friday, March 2, 2012

Week 6: Begin Designing

Weeks have been going by really quick. This week, I focused on designing my wireframes from last week.

At first, they were vertical but having the app be horizontal makes more sense, especially because it gives people more screen space and it feel more natural. It especially helps if they have a cover and they can stand the iPad up that way.

Design wise, I want to keep it quite simple so that the content users generate will not be overshadowed by the app itself. I'm trying not to brand it before designing it (which is hard especially if you want a color scheme or typefaces) but I'm trying anyways. I need to rethink the background so that it is more applicable to my content. I also should rethink the side navigation. It's not impossible but I need to think about people accidentally tapping it since it is closer to the hand than if it was on the bottom.

Next week is midterm presentation. I would love to have at least the "profile set up" scenario done as well as another scenario as to how the app functions. The rest will just be wireframes or verbally expressed.