User Interface Design 090

Do you remember how in college there were classes that were actually below 100-level? The classes that some folks were required to take but they didn’t count for any credits? Well, in trying to come up with a decent title for this blog post, I thought I’d throw in a 090 at the end of the title there since this post will be, in some ways, kinda like those sub-100 level classes. Simple (or simplistic, even), easy, basic-knowledge kinda stuff.

I have to tell you, I was in such a good mood at work today. I finished up a small project which I had begun last week (it feels so very good to make your final code commits… even though you know that bugs will be found, requirements will change, and something will inevitably be wrong with your code), and today I had to come up with a UI design for a filtering component in our application. To put it simply, our application has various “list” screens that list a lot of records and each of these list screens have a filtering component that can filter the records that are displayed to the user. They pretty much function as search pages. Anyhow, I was asked to come up with a design so that our users can not only search for records (existing functionality) but can also perform CRUD (create/read/update/delete) operations with their search settings.

Sounds like a ton of fun–was my first reaction. I was enthused about taking on this task because I saw this new functionality as being such a useful functionality for everyone–end-users, QA folks, us developers, business analysts, etc. I knew that anyone and everyone who uses the application would benefit from this functionality and find it extremely handy. Another reason why I liked taking on this task–I was told only the very high-level requirements–namely, that this functionality should allow the users to perform CRUD operations with their search settings. There was no story (i.e. requirements) written for this functionality and no mock-ups. It was all up to me. I love such freedom.

Well… without further ado, here are the steps I took to tackle this task. The last step is still in progress. I call this my “User Interface Design 090”:

1.Screenshots: Since this was going to be an addendum to our existing search dialogs and list screens, I took screenshots of all of the screens that were going to be affected. I then opened the images up in Gimp, cropped them so that only the parts I want are captured and then copied them into Open Office. I always find that to be a handy way of printing out screenshots that fill up as much of the paper as possible. There’s just something special about doodling on papers as opposed to staring at the monitor–it lets me be a little bit more creative.

2.Research: It didn’t take me too long to realize that I’m not the first person in the world to implement this functionality. This has been done many times before. Originality is good but why waste time trying to be original when there are already perfectly fine existing implementations of this functionality? I looked at various implementations of this–Bugzilla (opensource bug tracking software we use), Twitter (did you know you can now save your search settings in Twitter?), eBay, and even my BlackBerry Bold–the email application. I spent some time playing around with all of these applications. I made mental notes of things I liked and didn’t like, things that made me happy as an end user as well as things that made me scratch my head a little bit.

3.Doodling: After my research was completed, I went to the hard copies of the screenshots and simply stared at it for some time, trying to come up with a mental image of how I want this functionality to be implemented. Slowly, little by little, I started drawing the necessary components–checkboxes, text fields, buttons, etc. I also made various written notes on it–things that can’t be explained by drawing alone.

As I was doodling away, I tried my best to get into the mindset of the end user. To me this is such a crucial step in UI design work. In the end, when it comes to the UI, it is my end users that I need to please. I can build UIs that make my boss super impressed, the QA folks really happy, and my fellow developers envious, but if my end users aren’t gonna like it then I have failed. And that not only makes me look bad, but it makes my team look bad and the company look bad. I tried (as best as I could) to get into the mindset of our end users who use this software–for folks who have absolutely no aptitude nor interest in building software. And to be honest, I wasn’t exactly sure how I could most effectively accomplish this other than to simply take my time asking the What Would the User Do? question with every single doodling element I added on those screenshots.

One more thing to note–as I was doodling, I didn’t give too much thought to the limitations of the architecture/APIs. As long as I knew I wasn’t doing anything crazy I was let myself doodle away. I think it’s a bad idea to be bogged down with such limitations in your creative thinking stage. I’m not saying ignore all limitations. I’m just saying don’t worry about such things too much too soon. I can’t see how that’s going to help you come up with a good UI design.

After I got done doodling, I imagined myself as an end user accessing my doodle-turned-UI. As I went along this step, I made a few adjustments I thought were necessary.

I then went to Chipotle and rewarded myself with a 1110-calorie (yes, I did check my facts online) chicken burrito. SO GOOD.

4.Mock-up: Scribbles you’ve got written down on pieces of paper are useful but it’s even better (and more useful) if you can get them down electronically. After lunch, I made use of the Pencil Firefox add-on, which is a tool built specifically for UI mock-up purposes. You can drag and drop various UI-related items such as checkboxes, text fields, dialogs, fieldsets, and many more. It’s super easy to use. You can then export your finished work into a .png file.

This step took me no more than an hour to complete. Pretty impressive considering the fact that it was my very first time using this tool.

5.Consultation: After I finished mocking everything up, I sat down with my boss and discussed my mock-up with him. A lesson to be learned here: It’s a good idea to run your UI (or anything else, for that matter) ideas by someone. It doesn’t have to be your manager obviously, but it should be someone who is familiar with the software as well as the end users’ uses of the software. My discussion with him proved to be valuable since during our conversation a few things came up that I hadn’t addressed in my original mock-up.

6.Requirements: I got to write up a user story which details the new functionality. We make exclusive use of Google Docs for such purposes at the office. This is the first company I’ve worked for where that’s been the case and I’ve been really happy with doing it that way (What would we, software developers, do without Google?!?). I included the mock-up (exported as .png files) in the story. I tried to be as detailed as possible without specifying the implementation how-to’s of the new functionality in the mock-up. Even though I will most likely end up working on this feature set, the right thing to do when writing user stories is to leave such details out. Let others worry about the implementation details.

7.Review: Perhaps this should be bundled with the above step, but for emphasis-sake, I thought I’d make this into a separate step. It’s never a bad idea to review. If there’s one thing that being in seminary for 4 years taught me, it’s that you almost always discover mistakes when you’re re-reading through your essays. I read through what I wrote down in my user story. Surely, some minor edits were in order. I then printed out a hard copy of it so that I can take it with me and re-read through it before I arrive at the office tomorrow. As of now, the printouts are sitting on my desk next to me. If I finish this blog post up soon enough I’ll be sure to read through it before I go to sleep. :)

And this concludes User Interface Design 090.

2021

My Fitness And Health Routine

5 minute read

Something that is personally very important to me is that I stay fit and healthy for as long as possible in life. While I wouldn’t label myself a “fitness nu...

My System For Staying Organized At Work

2 minute read

Being organized is a skill I personally value and at least for me - it’s a no-brainer that being organized can help everyone do their jobs better. It was imp...

Back to Top ↑

2019

Personal Retreat

1 minute read

I drove about 2 hours west to Stockton, IL - to a place called Christ in the Wilderness (CITW), to spend a few days (Friday evening - Sunday morning) to myse...

Back to Top ↑

2018

Deconstruct

2 minute read

I recently returned home from attending Deconstruct along with a bunch of my co-workers. I thought I’d jot my thoughts down while the experience is still fre...

My Disappointment With The New Macbook Pro

2 minute read

When I started at Braintree I was given a new 2017 15” MacBook Pro with Touch Bar. It’s a really nice laptop overall and I don’t mean to sound ungrateful… bu...

A Few Weeks Into The New Job

3 minute read

I’ve been at Braintree now for almost 3 weeks and I can’t believe it’s only been a few weeks because I’ve experienced a ton of new things and have met a lot ...

Interview Process Takeaways

4 minute read

In the last several weeks I’ve had the opportunity to speak with numerous companies as a job candidate. While the experience is still fresh in my mind, I tho...

Back to Top ↑

2017

Thankful

3 minute read

I started 2017 with a ton of excitement over the opportunity to build Cappex’s very own college application product. I knew it was going to be an extremely c...

New Product Launch And Life Afterwards

1 minute read

A very large chunk of my life from the very beginning of this year until the end of July was focused on launching a new college application product. Thanks t...

Hello Is A Poor Greeting

2 minute read

I’ve done what I think is an insane amount of phone screens since December (well over 100) and in the last few weeks there’s something I’ve been noticing whe...

Hiring Is Tiring

3 minute read

Yep, hiring is tiring. Very much so.

Back to Top ↑

2016

The Christmas Gift Test

1 minute read

Ever since I started managing people several years back I’ve practiced giving Christmas gifts and a hand-written Christmas card to everyone on my team. I in...

Do Not Store Personal Data On Your Work Computer

3 minute read

I know that it’s often convenient to have your personal files stored on your work computer, especially If you’re like me and you spend a lot more time on you...

10 Lessons From 10 Companies In 19 Years

11 minute read

Since landing my first programming job when I was a junior in high school until now, I recently realized that I’ve now worked at 10 different companies, incl...

I wish DST would end

2 minute read

I really wish Daylight Savings Time would cease to exist. I can’t possibly imagine that DST would go away in my lifetime due to the sheer complexities and c...

Be Thankful

3 minute read

Last 2 weeks at work have been rough. This most recent sprint as well as the release ended up being much more difficult than what my team is normally used t...

Gradle Build Scan Rocks

2 minute read

Earlier today I attend a webinar hosted by Gradle, Inc. where Gradle Build Scan was introduced. If you’re already using Gradle as the build tool for your pr...

Compare Property Files

1 minute read

I’ve been working on a rather massive refactoring work that involves changing how Java properties files are organized. It’s vitally important that the prope...

Page Load Speed Testing

1 minute read

I decided to conduct some simple page load speed testing. I hope the following info might be of some value to some folks out there.

Replacing SSD in MacBook Air (13” mid-2012)

2 minute read

I was running low on my 13” mid-2012 MacBook Air’s SSD, which had me pretty concerned. Thankfully I recently discovered that the SSD inside this thing is re...

Simple Interview And Phone Screen Tips

5 minute read

I’ve been busy doing a lot of phone screens and interviews as of late. Actually, I’ve been doing a lot of interviewing during my time at Cappex. Since join...

Resolving Tethering Issues With iPhone

1 minute read

I spend roughly an hour and a half Monday through Friday commuting to and from work and my laptop is tethered to my phone probably 90% of the time I’m on the...

Deleting Non-empty AWS Glacier Vaults

2 minute read

I had a couple of AWS Glacier vaults that I had been meaning to permanently delete for awhile. When I tried deleting them via the AWS dashboard, I got the f...

Back to Top ↑

2015

Why Android Sucks

3 minute read

Android sucks. At least my experience of it has. Now, I’m NOT saying that Android-sucks-therefore-Apple-is-way-better. All I’m saying is that I’ve had 3 A...

Setting Up A 301 Redirect In Ruby On Rails

less than 1 minute read

I saw in Google Analytics that I’ve been getting a lot of hits on junhopark.com/index.php, which isn’t a valid page. I decided that it’d be best to set up a...

Back to Top ↑

2014

My First Album Is Now Available For Purchase

1 minute read

My first album Acoustic Worship is now available for purchase on CDBaby.com! Recording an album is something I’ve wanted to do for a very long time and I’m g...

Resolving Dns Issue On Mac Os X Yosemite

less than 1 minute read

I upgraded both my MacBook Air and MacBook Pro to Yosemite over the weekend and I saw that both my laptops were unable to connect to internal systems at the ...

A Memorable Phone Screen

3 minute read

A few days ago, I phone screened a QA Manager candidate that ended up being extremely memorable. It went something like this:

Workout Frequency Before And After Baby

less than 1 minute read

Ever since my son was born in late June, it’s been a challenge trying to find time to work out. Since I record every one of my workout sessions, I thought I’...

Merging Codebases In Git

1 minute read

A couple of weeks ago, I had to merge one codebase into another codebase and after a lot of searching for solutions on the web, I came across a solution that...

Back to Top ↑

2013

Why I Love Being Married

2 minute read

My wife and I met through a (very) random suggestion from a mutual friend 3 and a half years ago. It was suggested to us that we should meet up, get to know...

Pictures From Turks and Caicos

less than 1 minute read

Here are some pictures I took while I was in Turks and Caicos earlier this month with my wife.

My Thoughts On Commenting In Code

3 minute read

A skill that is often overlooked amongst developers and development managers is the ability to write good comments in code, which is understandable I suppose...

Hacker News By Points

less than 1 minute read

I frequent Hacker News (news.ycombinator.com) pretty often throughout the day and I realized that my eyes were almost always drawn to posts on the first page...

Playing Around With Lightroom

less than 1 minute read

I thought I’d give Adobe Lightroom a try and play around with editing some pictures. Well, here are the results.

One Less Debt

less than 1 minute read

Just paid off my student loans, which took me about 9 years and 3 months. I was planning on letting it drag on and on because of the super low interest on i...

Weekend Project Php Website On Heroku

1 minute read

I got hold of some really nice looking single page website templates earlier last week (from here) so I thought I’d go ahead and redo the website for my pare...

Three Monitor Setup

less than 1 minute read

Thanks to Plugable I’ve now got 2 monitors hooked up to my Lenovo laptop at work and I’m absolutely loving it. I definitely should’ve done this way sooner.

Teaching My Wife How To Code

less than 1 minute read

My wife recently decided that she wants to learn how to code and of course, I’ve volunteered to be her teacher. She has absolutely no experience with progra...

Stuff I’ve Been Learning

2 minute read

It’s been quite awhile since my last blog post and I had a sudden itch to write about things I’ve been learning (mostly at/through work) over the course of, ...

Back to Top ↑

2012

Moving From Subversion To Git

1 minute read

Last Thursday, my team made a successful transition from Subversion to Git. Here are some thoughts after having been on Git as a team for about a week now:

I Am Not Going To Pay You To See Your Portfolio

less than 1 minute read

Earlier today, I had a web design candidate who informed us that he would be able to provide us with an up-to-date portfolio of his design work for a flat fe...

Lessons Learned While At Lakeview Church

1 minute read

This coming Sunday will be my last Sunday at Lakeview Church. I’ve been a part of this church since summer of 2006 and I’ve been blessed to experience such ...

Hello Ruby On Rails Postmarkdown

less than 1 minute read

Decided to ditch PHP + WordPress + Lithium Hosting for Ruby on Rails + Postmarkdown + Heroku.

No More Taking Work Home

less than 1 minute read

It’s been about 6 weeks since I started working at cappex.com and while I’ve been really enjoying the work, I’ve also been guilty of bringing work home. I’v...

Job Search Tips From Personal Experience

4 minute read

Earlier this year I decided that it’s time for me to look for another opportunity outside the company. The company executives decided on being acquired by O...

Moodyshoerepair.com Redesign Launched

less than 1 minute read

I gave moodyshoerepair.com a (much needed) facelift over the course of this past week and it’s now live online. This is the first project completed on my n...

Been Awhile

less than 1 minute read

The last time I wrote in this thing was 10/22 of last year, which is also the time when wedding preparations got crazy. Well, thank God the wedding is now ov...

Back to Top ↑

2011

Taking A Breather In San Francisco

3 minute read

I arrived in San Francisco last night with Jenny and a friend of ours at around 10:30 local time to attend Jenny’s friend’s wedding which takes place later t...

Writing Good Software Simple Reminders To Self

3 minute read

One of the main purposes for keeping this blog is for me to think through and reflect upon things and to remind myself of the lessons that I’m learning. I k...

Commuting To Downtown Chicago For Work

3 minute read

My office moved from Westmont to Chicago about 2 and a half months ago and ever since then I’ve been taking the Metra train to get to work. There are some t...

Wow 7 Years Already Since Undergrad

6 minute read

This past Wednesday, I paid a visit to my alma mater (UIC) to be among the panelists to share my post-college experiences of working in the corporate world. ...

My Engagement Ring Selection Process

7 minute read

One of the main motivations behind why Jenny and I wanted to start this blog in the first place was so that this blog would (eventually at some point once th...

I Am Engaged!

less than 1 minute read

On Saturday, I got engaged to the most amazing girl I know. :) It still hasn’t quite hit me yet. To be honest, I’m guessing it’ll hit me once I get used to...

New Site Design

less than 1 minute read

I’ve been wanting to convert my site to a single-page design and after working on this on & off for the last several weeks, I’m glad to have the site fin...

Back to Top ↑

2010

Been A Long Time

2 minute read

It sure has been a long time since the last time I updated my blog. Here are the different things that have been occupying me in these last couple of months:

Excellent Book On Web Usability

1 minute read

One of the things I’ve been enjoying about work since I made the switch last November is being able to get my hands dirty with front-end web development and ...

Software Development As Missional Philanthropy

4 minute read

For some time now I’ve been really interested in going overseas for the purposes of doing missional philanthropic work. And by “missional philanthropy” I am...

User Interface Design 090

7 minute read

Do you remember how in college there were classes that were actually below 100-level? The classes that some folks were required to take but they didn’t coun...

If You Write Code Write Tests

less than 1 minute read

So… I’m scrounging around the internet looking for some TDD-related tidbits and I came across the following at www.artima.com.

Making The Most Out Of Band Rehearsals

8 minute read

Band rehearsals–some love ‘em, some hate ‘em, but there’s no denying that they are very much necessary, even for bands that are comprised of phenomenal music...

Lessons Learned From Being In The Shoes Of QA

5 minute read

At work we have a huge product release coming up very soon. There are a lot of new features to the application, which means that there has been a ton of cha...

New Recording - Gone From The Portrait

less than 1 minute read

Over the weekend I started re-recording a song which I had written a few years back. Vocals, acoustic guitar, electric guitars, bass, keyboards, drums-via-k...

New Music - Lullaby (Instrumental)

less than 1 minute read

After lunch @ Sweet Tomatoes with some friends I came back home and took a much needed nice, (too) long nap. Fast forward a few hours and it was around 11: ...

Done

less than 1 minute read

Yet another rendition of junhopark.com is done… at last! I decided to forsake my old Blogger posts since it’s been quite awhile since my last blog update an...

Back to Top ↑