EverBook: Evernote Device Concept

Evernote is an incredibly useful tool, but I constantly find myself distracted by the overly complex UI for the desktop app. I found myself wishing that I could have a stand alone device that is focused on providing a streamlined Evernote experience. I had to mock up a design for the device to get it out of my head. It is far from a practical product idea, I would love to have one.

The basic idea for the EverBook is a small notebook, sized somewhere between a netbook and a smaller laptop, that has a full keyboard, wifi/3g card, microphone and camera (on the back of the screen. The writing experience on the device would offer a minimalist alternative to a Markdown editor. You would have all the wonerfull syncing features that come with Evernote, and you could use richer formatting than is available in Markdown without cluttering the screen with UI.

Below you can see a more clear view on the keyboard for the device. The row of keys along the top would be used for formatting. The keys next to the spacebar that would typically be used for control, alt, etc. would be used for Evernote system functions.

A Preview-less Markdown Editor

I love me some markdown. John Gruber‘s creation of the concept is the one reason I am able to tollerate the Apple darling’s writing. I use Markdown every day to focus in on writing tasks, but I’ve always been frustrated with the state of the editor experience. Byword and iA Writer both get a lot of things right, but, for me, the display I see while writing is too disconnected from the output I am trying to create. I’m forced to use an app like Marked or the preview mode in Byword to see what my document should really look like.

There are a few ideas that I haven’t seen in any editors yet that I need for an ultimate editor experience:

1. Headlines that resize

2. Lines that become solid when your cursor is gone

Using these two new features along with the best features from existing editors, a really solid editing experience could be created that would remove the need for a preview mode or an additional app.

This is what my ultimate editor would look like:

View Full Size

Python + Django + WordPress = My New Site

Over the years, I’ve made a handful of personal websites. When I first got out of design school, I had a flash site with enough extra bells and whistles to encourage visitors to forget that there wasn’t much content. Since then, I’ve hastily thrown together an HTML site every time I was about to start interviewing for jobs.

A few months back, I decide to remake my personal site during a period of my life where I was happy at my job and didn’t need to rush to get something up as soon as possible. I wanted to make a site with a proper database backend, so I could easily add projects as soon as they went live. This was a great excuse to learn some server side web development (having only ever really done basic front end work in the past).

I set out to find a language to learn. I tried a few introductory tutorials for Ruby and Python. Ruby appeared more interesting a first, but then I stumbled across the book Learn Python The Hard Way by Zed A. Shaw. Zed’s approach to teaching programming really appealed to me. In each exercise he instructs you to read through some example code, type it all in manually (instead of copy/pasting), get it to run. At the end of each exercise, there are extra credit objectives for modifying the code. I bought the $3 PDF (the online version is free) and got started. 52 thoroughly enjoyable exercises. Once I was done with Zed’s book, I was ready to learn a web framework.

Django was the only choice I really considered for web framework. Everything else seemed like it was geared at more experience programmers. Django has a great tutorial to build your first project (a poll app). After going through the tutorial, I tried to jump right into building my new site. I poured over Django documentation to learn as much as I could, but I was struggling with learning programming basics, python and Django all at the same time. I ended up with some data models that sort of made sense and the some half formed urls and views.

I needed to find a starting point to build on top of. Github had a few portfolio app built with Django. I ended up using Pigmonkey’s django-portfolio. His example showed how to design dynamic URLs for project pages and how to pass content into views. Pigmonkey’s app was set up so that each project had a single image associated with it. I added a project image model (with a foreign key relationship to a project) so that each one of my projects could have a variable number of images.

 


I had an existing wordpress blog that I wanted to continue using, but I needed to find a way to import recent posts into my landing page. I dug around and found django-feedutil which uses the Python library feedparser. feedutil gave me a Django template tag that let me bring my wordpress rss feed into a view and loop through a set of posts, grabbing out the title, link and publish date. Awesome.


My site was coming together, but I needed a place to host it. I researched setting up Python, Django and additional libraries on my old host. It looked like it might be possible, but I wasn’t in love with them, so I looked for a Django friendly web host.

I was sold on WebFaction when I found this great video tutorial on installing a Django app with their tools:

I’ve been quite happy with WebFaction so far. They were quite nice about a little incident where I accidentally used a huge amount of RAM while misusing feedutil.

Well, that’s how I got to my new site. It took exponentially more work than it would have to create another static site, but it was a great way to learn more about programming. Adding content and updating my site is going to be much easier, and I should have a site that will last for a long time.

Microsoft’s New Futurist Vision

The most impressive part of this video is the graphic design work, but there are a few interesting ideas. As usual with these Microsoft futurism videos, much of it doesn’t make any practical sense. Eternal pessimist, Nicholas Carr used this video as the inspiration for an interesting post about how Utopia is creepy.

Some of the concepts surrounding the future of work aren’t half bad:

Large 3d display reminiscent of a drafting table. In the video, working guy does a lot of gestural control of the on-screen content.

Still using a physical keyboard but the entire desk surface is a display and touch surface.

Video communication with others made to look like tiny versions of coworkers are sitting across the table from you.

IDEO’s vision of “The Future of the Book.”

IDEO released a great video depicting their vision of the future of digital books. As mobile devices are maturing, we are finally in a position to apply the benefits of interactivity and social networks to long form text documents. Definitely some cool ideas in here. It isn’t thought through completely, but that is the nice thing about making a video like this.

The part of the video I most want to come true is the second piece, dubbed Coupland.

Coupland

Coupland explores the possibilities of sharing the experience of reading with your friends and coworkers. It would definitely be nice to see what your friends are reading and send recommendations to them, but I was more intrigued by the idea of having access to a company library. If the organization you work for or belong to has a group license to a title, everyone in the group can access the book. Just think of how a shared catalog of books and discussions around them would affect a company culture.

Company reading lists could be made public. In this example you see information about the books people are reading at Google. This information would be more useful and meaningful than an amazon review by a random person or a professional review from someone that doesn’t have similar tastes or fields of interest.

It would be refreshing to have social networking used like this. The discussions that take place on Facebook are generally mundane. Facebook exists for generic socializing, and there isn’t really a point to it. Social networks of the future should allow you to have meaningful discussions about more in-depth topics with people that share you interests. Ping is half heartedly trying to accomplish something like this for Music. Last.fm is similar, but seems to have more of a focus on letting you data mine yourself through scrobbling (which I actually love) than allowing you to discuss the music you are listening to with your friends or the community. I’m hoping that social systems for media content will not be attached to single retailers. That’s what I’m so cynical about Ping.

The video doesn’t explore the annoying road blocks that are holding us back from a system like this. Book publishers have been so cagey about changing anything relating to their business model. Negotiating group licenses will probably be a difficult. Too bad creating real life solutions like the one IDEO has envisioned isn’t as simple as coming up with UX design.

User Experience Process – Personas

For larger projects, I generally create user personas as part of my process. Personas are a way to document the target user groups for a given experience. They help to empathize with users, and they can be a valuable part of the discover/research phase with clients. It’s also nice to have client approved personas to back up decisions that you make once you get to site-mapping, wire-framing and art direction.

Here is the template that I normally use:

The content of the template needs to be customized to the fit the project, but the structure I use always contains:
• Personal Info (Image, Name, Age, Location and Job)
• Statistics (Vary by project)
• Background & Goals

Xbox Dashboard Update

The new Xbox dashboard has been leaked, and I’m liking the changes that have been made. It’s certainly not a revolutionary update like the last one. This update has minor changes to the functionality and visual design.

The new style matches the flat, square look that Microsoft seems to be pursuing across all their products. I like the move away from unnecessary gradients, gloss and skewed objects. The most dramatic change from the current dashboard is how the horizontal browsing has been flattened. The benefit of this change is that you can see part of an item to the left of the one you have selected.

UX Study – Multi-directional Corner Menu

UX Study - Corner Menu

UX Study - Corner Menu

UX Study - Corner Menu

I designed this menu concept when I was working on a site for the DSi browser. I was trying to come up with a menu that would work for either orientation of the the device.

New Site & Blog

Welcome to my new site and blog. I’m going to use it to keep track of my work, experiments and thoughts on user experience design.