Oh, drop downs, you cheeky little things!

Photo of code by Ferenc Almasi on Unsplash

Software screen capture

Why is it? Form elements are fully customizable using simple CSS styling except <select> drop downs. Oh sure, you can tweak colors, sizes, fonts, etc. but I’m talking about overriding the native controls and really making them your own. Of course, you can use jQuery, which is an excellent solution in most cases, but sometimes introducing additional scripts can interfere with what’s going on under the hood.

I recently stumbled upon a neat concept, and after a little wrangling, I was surprised to have found a pretty simple way to override the native <select> drop down. Oh, happy day!


Friday Linked List: 6/15/12

image of workflow diagram
  • An Introduction to Lock-Free Programming: “the lock in lock-free does not refer directly to mutexes, but rather to the possibility of “locking up” the entire application in some way, whether it’s deadlock, livelock — or even due to hypothetical thread scheduling decisions made by your worst enemy. That last point sounds funny, but it’s key. Shared mutexes are ruled out trivially, because as soon as one thread obtains the mutex, your worst enemy could simply never schedule that thread again.” As they keep adding more and more cores to processors, being able to handle concurrency becomes even more important, but the more I think about it, the less I think that we know how to deal with the problem. I suspect that Erlang’s approach using message passing of blocks of immutable data is the long-term answer, but I see the syntax of that language being too big a hurdle for most folks to leap over.
  • Design Patterns: When Breaking the Rules is Okay: “We know what buttons should look like, how they should behave and how to design the Web forms that rely on those buttons. And yet, broken forms, buttons that look nothing like buttons, confusing navigation elements and more are rampant on the Web. It’s a boulevard of broken patterns out there.” I think that we’re on the cusp of a new Cambrian Explosion of new UI/HCI approaches, and I hope that we all can keep a solid grounding in the fundamentals as we invent this next new wave of computing.
  • bpython: A replacement REPL for Python, adding things like syntax highlighting, autocomplete, rewind/undo. Similar to iPython, but less heavyweight.
  • music-21: a Toolkit for Computer-Aided Musicology: Very interesting Python library out of MIT for dealing with music at the symbolic level. I especially like the example below — one of the first bits of code that I ever wrote was a piece of BASIC to calculate 12-tone matrixes to save myself time in undergrad music theory. (Yes, of course I spent more time writing the code than I would have spent doing things by hand…)

For example, we can create an instance of the row from Alban Berg’s Violin Concerto, use the show() method to display its contents as text, and then create and print a TwelveToneMatrix object.

<<< from music21 import serial
><< aRow = serial.RowBergViolinConcerto()
><< aRow.show('text')
{0.0} G
{0.0} B-
{0.0} D
{0.0} F#
{0.0} A
{0.0} C
{0.0} E
{0.0} G#
{0.0} B
{0.0} C#
{0.0} E-
{0.0} F
><< aMatrix = aRow.matrix()
><< print(aMatrix)
  0  3  7  B  2  5  9  1  4  6  8  A
  9  0  4  8  B  2  6  A  1  3  5  7
  5  8  0  4  7  A  2  6  9  B  1  3
  1  4  8  0  3  6  A  2  5  7  9  B
  A  1  5  9  0  3  7  B  2  4  6  8
  7  A  2  6  9  0  4  8  B  1  3  5
  3  6  A  2  5  8  0  4  7  9  B  1
  B  2  6  A  1  4  8  0  3  5  7  9
  8  B  3  7  A  1  5  9  0  2  4  6
  6  9  1  5  8  B  3  7  A  0  2  4
  4  7  B  3  6  9  1  5  8  A  0  2
  2  5  9  1  4  7  B  3  6  8  A  0

Should Developers Design?

Two recent articles on Hacker News hit close to home for me. The first post linked to a goal-tracking app for iOS that received many positive comments for its very clean and intuitive user interface. The second post was a link to a blog post titled Don’t look for a UX guy, be a UX guy.

I also have a goal-tracking app for iOS, one that uses default iOS controls, basic fonts/color schemes and focuses on function over form. Guess which one I’m now using on my iPod?

UI/UX is hard to get right and seems mystical to us non-designers. My first instinct is to get code working and tack on the UI so it conforms to the implementation decisions I’ve made. But if empathy for users is the goal, this process is exactly backwards.

I certainly want to improve in this area, but the left side of my brain just doesn’t want to concede any ground to the right side. Why spend time learning design skills when I can learn a new programming language or new web framework?

One resource I have found helpful is Bootstrap from Twitter. Bootstrap provides a basic layout template along with several styled controls/icons to use for web development.

Also, at one time or another, I’ve seen the following books recommended for learning UI/UX:

Alas, these books still sit in my Amazon wish list unread. I really do want to get to them but first I need to finish that book on Erlang, continue experimenting with Backbone.js and …

Maybe I’ll just leave design to the experts.