I’m not into labels. People are people. I’m a people too. People do things and I like to make it easier for them to do the things they do.
I like to solve problems. You can call me a problem solver. Some people call me a UX designer. Some interaction designer, web designer, project manager, front-end magic creator, graphic designer, artist or jack of all trades.
My friends and family call me Amanda.
I’ll probably call you a user if you use my products, but that’s just for ease of conversation. Sometimes you just need to categorize people into groups and generalizations so you can build better stuff for them, you know?
I like learning new things. The more life experience I gain, the more I’m paying attention to the efficacy of how I learn those new things. I prefer reading over video content because it’s easier to skim through the parts I’m not interested in.
As much as I like consuming information through text, I’ve never liked reading pdfs on the web. They’re not formatted well for a computer screen and they’re even worse for a mobile phone.
I recently discovered a web app that changed all that. It’s powered by Spritz, an innovative new way to read. The app is called Readsy, and it allows you to upload a pdf and read it in a fraction of the time of your normal reading speed. It displays the text one word at a time, at the words-per-minute rate that you set yourself. It’s easier explained by checking out the website yourself. Ironically, this is a perfect case of images speaking more than words.
We just got out of a very long (3 hours) but very productive brainstorming session for Call of C’Thulhu. We’ve decided to focus on bringing our story together in a storybook kind of style, all in a Necronomicon style of book. We’re focusing on breaking the motion piece into four different pages, with a layout that resembles something similar to the original Alice in Wonderland book. The first spread would include the starting scenes at the main gate as we follow Joseph up to the apartment door. The second takes place in the professor’s living room, and the third in his office. The last would include the scene where Joseph runs out of the office to …… (c’mon, really, did you think I was going to tell you the ending?!)
Similar to the hyped but flopped (or at least not living up to my expectations) Alice in Wonderland book for the iPad, the user will be able to flip through and turn the pages as if it was a real physical page. Unlike a physical book, the text will leave its static line and move to follow or repel (we haven’t decided yet) the touchpoints on the screen. The characters of the text will magically collect around the screen and in a flurry of magical particles and text, the underlying motion piece in a Sweeney Todd style will erupt out of the mix.
Within each of the motion pieces, we’ll have three different interactive components that the user will have to prod around for on their own and can interact with. We want to make it as intuitive as possible and leave it up to the user to figure out what elements are interactive, kind of like the game Windosill. Without giving away all of our secrets, three of the underlying themes seen throughout the story are bugs with tentacle like legs and feelers, worn out faces and souls, and bringing light to some of the chants traditionally associated with the story. Of course, if it’s the first time you’ve ever encountered the story, and you just want to watch it all from start to finish, you’ll be able to do that too.
The part that I’m the most excited about is actually the transitions from the storybook page to the playback of the motion piece. On first glance, the page will look like a regular paper copy of a storybook, only with a bit of old style charm, complete with a fancy dropcap and other embellishments on the page. But as soon as the iPad begins to tilt, or the user touches the screen, the characters will move. They’ll jump around the screen, either being drawn to the touch points on the screen or being repelled from them. The user will be able to play with the particles and smoosh them around the screen to create a bit of a magical soup where the motion piece will expand to utilize more of the available screen, and emerge from the deep magical depths to continue the story. Anyone who knows me, knows I have a thing for typography. I’m glad that we were able to incorporate and base typography both visually and with interactions. Check back in a few days; I hope to have a test done by week’s end.
I graduated from the Digital Design program on the 28th of April, but I’ve managed to keep my fingers in the pot by working with other VFS students and alumni on a high quality interactive/motion magazine for mobile devices. It’s called Project Space Squid, and it’s broken down into 6 different project teams that will each be working on their own story over a course of four months. I have the pleasure of using my development skills to collaborate with EBM (Entertainment and Business Management) students Sandra Rojas González and Patsy Tomkins, motion designers Ehab Kamal and Nida Khan, graphic designer Celia Chung, interaction designer Nick Lenko, and flash developer Vincent van Haaff on a project based on the story Call of C’Thulhu by H.P. Lovecraft. For those of you not familiar with H.P. Lovecraft’s famed stories of the early 20th century, because I certainly was not before committing to this project, he is famous for writing horror, fantasy, and science fiction.
We are working with a shortened adapted version of the film Call of C’Thulhu, which will be a combination of a 3 minute motion piece with interactive components overlaid into the film. The story begins with a 20 something man named Joseph running through debris in a chaotic city in the 1920’s. He’s in a hurry to get to a professor with urgent news, but when he arrives at his office, he finds a mess of papers and the professor dead. His hand cut off and the words “I am your servant” are printed on the ceiling in his own blood. Joseph runs to the roof knocking over candles as he goes, erupting the office into flames, and finds a large mythical creature on the rooftop of the building.
We’re still in the conceptual stages of the project and pitch our ideas with a proof on concept on Wednesday this week. You can follow our progress both on my blog and the official one for the entire Project Space Squid.
Taura and I are proud to present to you our final project in a 4 minute short film. Don’t be confused, it is an interactive project, not a motion piece, but we felt it was best to present it this way to reach the masses in it’s whole interactive entity.
I’m not quite there yet. It’s almost done, There’s still some bugs, my scoring doesn’t quite work, and you can see the box 2D components (the coloured boxes and lines that build the world) and the outside visuals of trees and leaves aren’t included so I can see exactly where the ball goes, but I’m looking for some informal feedback now. I have two questions for anyone out there willing to take a few minutes to answer them.
#1 When you see the score counter telling you that you have 3 balls, do you think you have 3 plus the one you’re playing with, or three total?
#2 Do you think the ball counter works better up top with the score, or would work better at the bottom with the elephant launcher?
#3 (If you’re feeling adventurous) Any bugs that you find when you play the game? Any suggestions for visual style or game play would be appreciated. If somebody can get the ball up the ramp, that would be good to know as well, because I can’t. But I’m not exactly the best gamer out there to be testing this.
Today Taura and I met with a fresh set of eyes (belonging to Gagan Diesh) to review our final project. Past students had clouded my idea of a fair and helpful person until all I could imagine was a storm ripping through the centre of our project for no reason other than to see us shudder away in fear of the “real world”. While my first thoughts were “I don’t want to cry”, they quickly turned into “I don’t want to waste my time on something that isn’t going to help me progress as a creative professional”. Still a little cautious, we had a class to prepare for our meeting last week. Some time during the class, my better judgement returned to me as I realized that no professional would make it very far in the world if all he did was tear people apart.
Going into our meeting well prepared, with a good night’s rest, and a clear mind about what to expect returned a great half hour conversation of progress and critique. While originally we had planned to include test and voice prompts for interactions within our game, Gagan suggested we try more intuitive prompting methods like small animations for our characters to signify that they were waiting for the user to interact with them. Small animations like a bunny tapping it’s foot, rolling it’s eyes or falling asleep would help prompt the user to interact with the character. Grass blowing in the wind, speech bubbles appearing from a rumbling tummy, or arrows to tell the user which way to move the character were also suggested.
Being on the cutting edge of interactive design, experimenting with mobile devices and augmented reality, he also warned us to expect glitches. Expect that there will be problems and we won’t be so disappointed when they happen at the end of the day. For this reason, and due to the fact that we still don’t have a Nexus One phone to test the app on, he said that it would be more reasonable to develop the project for a computer screen, with the intention of moving it to the phone in the future. While we’ve been fairly attached to the idea of moving the camera around the book to explore the space, rather than moving the book up to the camera on a computer, Taura and I will need to discuss this option further before making a decision on what primary platform we’d like to build for.
On a final note, Gagan thought it was important to promote this project during it’s full process, not just on it’s completion. Blogging on our own sites and on forums, sharing our code, and just keeping ourselves out there, with a cookie trail, will help to build an online persona that can only benefit us in the job hunt upon graduation.
Lots of good advice, with fairly easy implementation is all we got out of our meeting today. I’m so glad that I went in with a clean slate and no expectations. Gagan was an easy going, friendly personality that I enjoyed conversing with. He was knowledgeable, and gave good feedback for what we had to present. I hope to cross his path in the future.
Yesterday I took on the task of deciding on a font for the mobile device portion of our final project. While I knew that there must be fonts out there that would perform better than others on a small screen, I had never thought about it until this point in time.
Of course, like every good design, typography included, there’s a slew of design considerations to be made when designing (in my case choosing) a font for a small mobile device. While as a designer, I’m always looking for something a little different that lends itself nicely to whatever project I’m working on, sometimes I do sacrifice a little clarity for a special effect or extra ligature. Mobile fonts are likened to signage on littlespringdesign.com, where they say that the audience of the visual font is varies so greatly, from young to old, experienced to newbies, visitors to regulars, that functionality (legibility) must be the prime attention.
Fonts are generally set on a computer as a vector, a scalable letterform with smooth edges. As smooth as these edges are, they are still made from pixels, which are tiny squares on the screen that work together to produce a smooth line. When you reduce the size of a letterform, or anything vector for that matter, into something that’s only 20 pixels high, instead of seeing a smooth transition on curves and corners, blocking starts to happen and you lose the crispness that you had when the letterform was larger. Holes in the middle of letters, known as counters, can start to fill in, thin lines can start to disappear and pretty quickly you can end up with a muddled font.
For this reason, straight, even width lines are best to construct a screen font. Keeping descenders (like the hook on the y) and ascenders (like the top part of the l) shorter rather than longer, as well as keeping the x-height (height of the middle part of the letters) 65 to 80% of the size of the letterform will also prevent lines on top or bottom from running into each other. (The space between lines of text is called leading.)
Considerations to the amount of space that is available on the screen to hold the chosen font also dictates what it should look like. With a limited amount of space, a condensed font, or at least one that is not too wide will get you more characters per font size than a regular one. A font that is already well spaced (called kerning) between each letter is also important to ensure that there are no gaps when reduced in size, or that letterforms blend together. This will all help increase legibility for the user.
So it’s obviously been a little bit of time since my last blog post. A lot of stuff has happened in the last two weeks. Me not being perfect, and always learning better from mistakes than getting it right 100% of the time, hit a bit of a rut with my partner on my final project. Lack of communication didn’t help the problem. After agreeing to communicate when issue arose instead of stewing about them for the weekend certainly helped to clear the field and the strike on work was over.
We’re just at the end of week two, and we’ve come a long way since we started. We also worked on finessing the interactions between the user and the characters of our story yesterday, among other things. You can see some of the sketches that Taura drew out above. Initially we were planning on the story being told through basic augmented reality characters that you could direct across the screen, and movie clips to fill in the blanks in between interactive sequences. Both the interactive sequences and movie clips would be triggered by an image called a tag that would be on each page spread.
After brainstorming more ideas, we’ve decided that we want to incorporate some fun flash games into the mix as well, also triggered by the AR tags in the storybook. This way we can keep the user involved with the story with a consistent character, but in different ways, all with the same media: a phone and a storybook. We’ve added in some surprise elements to the storyline that we think will make it a pleasant surprise for those of you who are familiar with the short animation version of the movie. Stay tuned!
Day three of week one of my final project. Ahem, I should say our final project. I’m working with Taura Hanson to design and develop an interactive augmented reality storybook for multitouch devices. Now for all of you non-designer/developer people out there reading my blog, say people like my mom, this is what we’re getting our hands into.
We’re working with an award winning Illustrator, also graduate from the Classical Animation program at VFS a few years back, Choom Lam. We’re using her short animation In The Beginning, and adapting it to make a storybook. Not just any storybook mind you. This is going to be a storybook with just the backgrounds printed inside. The characters and various foreground elements will only be able to be seen with a webcam or a mobile device such as the new Google Nexus One, Apple iPhone, or the Palm Pre. You’ll be able to touch the screen and interact with what you see on screen, just like you can with current apps, only you’ll still be able to see the storybook in the background. The book is the “world” and the augmented reality characters are the players.
We’ve just completed our project plan, and will continue working on our storyboards and script among other things for our regular Wednesday meetings with our advisor, Dave Olsson. We’re planning on spending a combined total of 584 hours in 10 weeks. There’s lots to document along the way and lots for you to follow. Check back regularly for my journey to the largest interactive project that I’ve worked on to date.