Archive for July, 2008
« Earlier

  • Thursday

    photo
    • allyn
    • July 31st, 2008
    • 03:35:37 PM
    • No Comments

    So, today is Thursday. Since I missed my Thursday and Friday posts last week, I’m doing them this week. It actually worked out pretty well like that, although after Friday I’ll have to think up a new scheme to find titles for my posts.

    Today has gone decently. I’m working on refining the search on a specific part of our site, and it’s getting complicated. I fondly remember yesterday around this time when Dusty suggested I implement these changes, and I said “Ok, but that’s going to take a while.” He responded with something like ‘Oh, it won’t take that long’. I disagreed, and here we sit. A full 24 hours later and I’m not even close to being done. :D

    Dusty: 0
    Allyn : 1

    What I’m trying to do is essentially teach SQL the same sort of inheritance many modern languages have. ActiveRecord doesn’t do this kind of inheritance right now, but it does do single table inheritance. Single Table inheritance is nice because it reduces the amount of joins one must do on a query, thus letting the query operate a bit faster. That’s all well and dandy, but we’re using Ruby here - the whole concept of which is to make things as easy for the programmer as possible, speed be damned*. I’m not fond of single table inheritance for this situation. I’d really like class inheritance, because I really don’t like the idea of having properties of a subclass in the table of it’s parent. By don’t really like, I mean to say hate with a passion. Anywho, the first one is easy, but the second one is anything but trivial.

    Other then that little issue, the day has gone pretty well. Tonight there’s a shingding at a local bar-thing. I’m not that excited about the bar-thing itself, but hopefully the company will be entertaining.

    * While this may be true, the reality of course is that we’re making a website, and the interwebs is the land of impatience. Thus, Robert and I are in fact quite concerned with the speed of our application.

  • 7 nice search interfaces

    photo
    • ering
    • July 31st, 2008
    • 11:42:41 AM
    • No Comments

    It’s getting to that point in the project where I need to add a design element, thus far, unaccounted for. This is where it gets tricky. How do I keep the new element consistent with everything else? What if the thing I had not accounted for is conceptually and functionally different than everything else, but it’s totally necessary? How can I deal with this? How can anybody?? Why is life so hard??? etc etc.

    I’m talking about search. I decided to leave it for one the last things to take care of because it’s better to know all the types of content that will need to be searched before you go ahead and design a search.

    Search is a pretty common feature in websites and web apps these days, and it’s sad that most search result pages are unattractive, don’t match the rest of the site and contain lots of sponsored results. We’re not all Google, people. So basically, most of them were pretty horrendous; here’s a few that stood out as “not horrendous.”

  • Track your Campfire Usage with Campfire Spider

    photo
    • robert
    • July 30th, 2008
    • 12:24:22 PM
    • 6 Comments

    For those of you that read every word I say, you might have noticed that I hinted at another project that Allyn and I were working on in our free time. Well, the time has come to unveil our mini project.

    It is a little known fact that Brightmix uses Campfire for office chat. Despite the fact that we are all within an earshot of one another, everyone still uses it to pass messages back and forth. Although, the conversations are not always… productive, it still has a lot of valuable information (Like SVN integration)

    Campfire itself has a lot of features, like file uploads, integrated pictures and YouTube videos, and so on. If you really want a list of features, check out their website.

    Probably my favorite, undocumented feature, of Campfire is using the @ in chat to auto-complete someones name. It is something I have found myself using in other chats besides Campfire, just to find that it does not complete their name for me!

    Although, it does not always work in our Campfire because we get rather creative with our names from time to time with characters that are not on my keyboard.

    Anyways, it was been mentioned a while back that campfire has turned into a cesspool ever since “The Interns” arrived. Being that we’re computer scientists, Allyn and I took it upon ourselves to actually see if this was true by measuring the increase in the number of campfire messages since our arrival.

    To do this, we wrote a little Ruby application that would go through the transcripts of all Campfire messages and count ‘em up! We actually started coding this (and completed it) after our second day of work at BrightMix from Allyn’s apartment, and we didn’t even have internet at the time. We wrote the whole parser from four saved html files that we grabbed while we were at work.

    Of course, we were not to familiar with Ruby at the time since we had literally started using it 2 days prior; as a result, we ran into some problems. We ended up going to a gas station down the street from us, Cubby’s, which offers free WiFi and we looked up the solutions to our problems, then returned to Allyn’s apartment.

    We hacked at it the rest of the night, and by the next morning we had a “workable” version of the application. Though, it was not without its problems. The graph had issues showing up correctly, the parser wouldn’t work if you were on an admin account (Allyn and I just have normal accounts and we were not expecting some changes in the UI that admin accounts have), and there were a few timeout issues.

    We fixed these bugs… and there the script sat in my Documents folder for about two months.

    Last night I finally decided to clean up the graph display (we use Google Charts) so that it would be in a more postable form! Winner.

    So, without any more delay… I present, the Campfire Spider.

    It requires that you have Ruby installed, and you can use it as follows:

    ruby campfire_spider.rb campfire_subdomain username password

    So, if your campfire site was “brightmix.campfirenow.com”, your username was “bill@brightmix.com”, and your password was “omg123″, you would run:

    ruby campfire_spider.rb brightmix bill@brightmix.com omg123

    After you type in this command and it works (It will throw an exception if your login information was wrong), it will likely take anywhere from five to 500 minutes to complete. So, grab some food, or find a fun flash game to play - I don’t care what you do - just let it run. When it finishes, it spit out two URLs in your console. One will be the raw-google-charts URL… It’s kind of long and epic, so the second URL is a TinyURL version of the google-charts URL.

    You can then open that up in your favorite browser, and there will be a graph of Time vs Messages.

    In case you were wondering, this is the Brightmix campfire usage graph:

    Hope it works for you! Let me know if you run into any problems.

    Download Campfire Spider here!

    PS: If you look closely at the graph, campfire usage has gone up… but does that mean the quality of messages went down? I don’t know, maybe version 2.0 will have a signal vs noise detector.

  • 7 tips on css

    photo
    • ering
    • July 29th, 2008
    • 03:11:53 PM
    • 5 Comments

    This one time, we were all talking, and I said, “I think it would be really good if we had a css style guide.” And everyone seemed to agree. Then everyone was like, “Hey, Erin, you know css and you know the fonts and stuff you designed, so you should make it.”

    I may know css, but that doesn’t mean I enjoy it. Actually, I’m starting to get the impression nobody here really enjoys creating stylesheets. It’s like the little lost orphan, sitting in the corner…or alley…or maybe in between two garbage cans in the alley. with a mangy kitten.

    Anyway, when it comes to css, here are seven things I do not only to make well-formed code, but also to create a sensible document for those who will be looking at it and editing it in the future.

    Categorize
    Categorize the selectors by function and/or location on the page; it depends on the site. Look at your design overall and find what parts can be grouped together, whether it’s the text styles or the navigation area…whatever. Mine is usually something like:

    1. Global Defaults
    2. Header
    3. Nav
    4. Headings
    5. Text Styles
    6. Links
    7. Lists
    8. Forms

    Table of Contents
    For the sake of you as well as others, it is very polite to place a table of contents at the top of your stylesheet. It would look the same as the category thing above, with the idea that each chunk of code would have a commented out header stating its category.

    Indent
    Everybody seems to indent a little different, if they indent at all. Some examples are:

    1.

    #header h1 { font: 100 36px/34px serif; color: #000; }
    #header .contactform h2 { font: 100 24px/28px serif; color: #aaa; }
    h3 { font: 100 12px/18px serif; color: #333; }

    2.

    #header h1 {
    font: 100 36px/34px serif;
    color: #000;
    }
    #header .contactform h2 {
    font: 100 24px/28px serif;
    color: #aaa;
    }
    h3 {
    font: 100 12px/18px serif;
    color: #333;
    }

    3.

    #header h1
           {
           font: 100 36px/34px serif;
           color: #000;
           }
    #header .contactform h2
           {
           font: 100 24px/28px serif;
           color: #aaa;
           }
    h3
           {
           font: 100 12px/18px serif;
           color: #333;
           }

    I go with the third one because of the spacing. For me, it’s the one that is easiest to visually separate the chunks and individual properties when you are skimming through.

    Alphabetize
    Within each category, I alphabetize the selectors. I don’t really bother alphabetizing properties within selectors because there really shouldnot be enough properties in one selector that would require any method of organization.

    Subcategorize
    Don’t add more classes; cascade! Subcategorize! Basically, anytime you can find a way to define a selector without giving it a class, the more flexible (and less full of hassle) your code is for changes later on. For instance, you could do this for a list item in an unordered list, nested in an ordered list:

    li.mynestedlistitem { property: value; }

    but this is better:

    ol ul li { property: value; }

    That says “for any li within a ul within an ol, apply that stuff in the brackets”. Along this line of thinking, when you go to organize your stylesheet, you can place the ol ul li under the ol, so visually you can see that they are related.

    ol
           {
           property: value;
           }
           ol ul li
                  {
                  property: value;
                  }

    Comment
    /* Comments are awesome! Use them! They'll help you organize and remember why you did something weird and tell other people why you did something weird and point out places you made a hack! */
    /* (^o^) =====+++ AND you can decorate them super-pretty-like. +++===== (^_^) */

    Condense
    One last and possibly obvious note — better to condense this:

    font-family: sans-serif;
    font-size: 16px;
    font-weight: 900;
    font-style: italic;
    font-variant: small-caps;
    line-height: 18px;

    into this:

    font: 900 16px/18px italic small-caps sans-serif;

    And here, for your enjoyment, if you’re into this sort of thing, here is the (unfinished) typography stylesheet for our project. (Some names are quite generic right now, since it’s still under wraps. Also, it hasn’t been hacked for IE yet.) typography.css
    ————————–
    Taking on the task of creating the stylesheet has been a very good lesson for me. Even though I planned with a limited set of fonts and sizes and colors and weights and so on, as I’m creating the stylesheet, I keep coming across places where I thought, “Oh…really, this font would look better in red here. I’ll just change it.” Yeah.

  • When are we launching!?!

    photo
    • dusty
    • July 26th, 2008
    • 04:27:44 PM
    • 3 Comments

    Want to be some of the first people to see the finished product that everyone here has been hacking (and designing) away on for the past 3 months? (more…)

« Earlier