Subscribe To Our Blog

Archive for 2008

iwishi

Tuesday, December 23rd, 2008

safariscreensnapz001

Slice of Lime built this site in under an hour to demonstrate the power of Twitter, to spread some holiday joy, and to hopefully raise some money for the fabulous Make-A-Wish Foundation of Colorado.

The site taps into what people are saying on Twitter in real time, filtering the results to only include people making some sort of wish.

Enjoy!

Inspired: Adobe MAX 2008

Tuesday, December 23rd, 2008

max_photos

Last month we flew out to San Francisco on a last minute whim to check out the Adobe MAX 2008 conference. We left Boulder fully expecting to learn new and interesting things that we could accomplish with their updated line of products, most of which make up the repertoire of software we use to design and build websites at Slice of Lime.

What we didn’t expect was to be blown away by the sheer magnitude of the conference and how being around so many like-minded peers – thousands of them – could really impact the way we felt about the industry we’re so passionate about. People from all different walks of life and a multitude of professions were there, and, whether young or old, designer, developer, manager or anything in between, they all seemed as elated as ourselves to be involved.

It was enthralling to sit in on a session hosted by some of the companies in the business whose work we idolize. To hear these teams describe the way they collaborate on projects, approach similar hurdles in design and development as ourselves, and still manage to produce industry-leading work was a real treat and provided us with an indescribable amount of motivation and inspiration to get home to Boulder and apply it to our next big project.

So we went for the knowledge and returned with the experience and the wild desire to do something even greater than we’ve done before, and it was all a matter of getting inspired when we weren’t necessarily expecting it.

Happy Holidays from Slice of Lime

Saturday, December 20th, 2008

happyholidaysslice

Happy Holidays from the Slice of Lime workshop! Here’s a sneak peek at what happens in the Slice of Lime offices. Click here!

Perfect Ten: Creative Commons looks back on an exciting 2008

Friday, December 19th, 2008

bloggingjohn

A big thank you to everyone whom joined us for last night’s Creative Commons. This month’s event featured a video chat with John Allsopp all the way from Australia, discussing the upcoming Web Directions North Conference.

Web Directions North, one of the world’s leading conferences for web professionals, returns for 2009 - this year in Denver, Colorado, February 2—7. http://north.webdirections.org

A bit about Web Directions North: Web Directions focuses on the professional development of web designers and developers, interaction designers, user experience professionals and other practitioners in the web arena, whether they work as a contractor, in a design agency, in small or large businesses, in government, education or the not-for-profit sector. Whatever your or your company’s role in building or managing web sites, applications or communities, Web Directions is full of practical, valuable insights, education and inspiration.

Please enjoy the holidays and watch for an announcement for the next Creative Commons event. In the meantime, join the Creative Commons MeetUp group for information on upcoming events, as well as contact with fellow members: http://webdesign.meetup.com/487/

Using SimpleTest with the Zend Framework, part 1

Tuesday, December 2nd, 2008

Recognizing the need to focus on certain specific technologies, we at Slice have spent time researching various development frameworks used to create dynamic websites.  While there are a number of different development frameworks out there, each with their various advantages and disadvantages, for various reasons we have chosen to examine the Zend Framework (ZF) for developing dynamic PHP websites.

My most recent experience prior to joining Slice of Lime was in using .Net in a relatively Agile methodology.  From that experience and from listening to the experience of others who have implemented an Agile methodology, I am becoming convinced that Test-Driven Development (TDD) is an indispensible practice for developing web applications.

While I am satisfied that our decision to focus on ZF will pay dividends to us and our clients, it is still a relatively new technology, and one must cast a particularly wide net to garner documentation on problems in developing with it.  My particular problem at this point is “How do I implement the TDD procedures I am familiar with while using ZF?” I was excited to see that ZF includes the Zend_Test class group, which extends PHPUnit’s classes.  Familiar with SimpleTest, a tool similar to PHPUnit, I thought, how difficult can it be to implement Zend_Test in my project?  The answer for those adequately familiar with Zend is probably “Incredibly Easy!”  For those of us just beginning to use Zend, with no familiarity with PHPUnit, and an eagerness to dive into getting code written the answer is “Difficult enough that I don’t care to investigate beyond a few internet searches.”

For a number of reasons I, like other exasperated bulletin board posters out there,   found the Zend documentation for Zend_Test insufficient to get me started.  I was introduced to SimpleTest by the authors of PHP In Action and their straight-forward example that demonstrates incrementally building a test-suite – an example the Zend documenter would do well to check out when they revisit the documentation for Zend_Test.  I decided I would forgo using Zend_Test and PHPUnit for now in favor of the familiar SimpleTest.

I began by sticking the simpletest directory (downloaded from simpletest.org) into my project, and decided to get one test to pass.  For the moment being, I put the simpletest directory into the webroot directory at the same level as my application and library directories in what is the standard directory configuration for a ZF project.  I’m not convinced I’ll leave it there, but I thought for simplicity’s sake, I’d try having it there.  I may also see if it makes more sense to have it up a level (at the same level as httpdocs) or in the library (with Zend).  I also created a tests directory at the same level that will include all my test files.  The structure looks like this then:

httpdocs
    application
        controllers
        models
            dao
            domain
            manager
        views
    library
    Zend
    simpletest
    tests

The first test file I created in the tests directory is testOne.php:

<?php
require_once(’../simpletest/unit_tester.php’);
require_once(’../simpletest/reporter.php’);

class TestOne extends UnitTestCase {

     function TestPass() {

          $this->pass(”Test Passed”);

     }

}

$test = new TestOne();
$test->run(new HtmlReporter());

I open my browser to http://localhost/tests/TestOne.php.  My first test passed no problem!!!  Ok, not so exciting since I explicitly told it to pass.

Next I decided to test a simple business object.  I created a domain object called Company.  (The model for this application extracts the business objects from the common Table Module pattern that ZF employs.  Instead of the domain objects directly extending or wrapping Zend_DB_Table, a manager class uses data access objects(dao), which extend Zend_DB_Table, to create concrete domain objects.)   I created the file testCompany.php in tests:

<?php
require_once(dirname(__FILE__) . ‘/../simpletest/autorun.php’);

 class TestCompany extends UnitTestCase {

     function TestCreate() {

          $company = new Company();

          $this->assertIsA($company, ‘Company’);    

    }

}

Note: while poking around with SimpleTest I found that I could include autorun.php instead of having to include the unit_tester and reporter files and having to explicitly run the test, a development that must be relatively recent to the publishing of PHP In Action and a nice feature.

I know that I am becoming more of a TDD disciple when I take delight in seeing a red bar upon first writing a test.  Without a Company class my test failed.  Now I added the class file, Company.php,  into /application/models/domain.

<?php

class Company

{

}

Of course I also need to include the class file in my test file:

require_once(dirname(__FILE__) .‘/../application/models/domain/Company.php’);

My test, http://localhost/tests/testCompany.php passes.  I utter, “Red-Green-Refactor,” under my breath.  I am going to want to do some testing of the manager, but I first decide to give my Company object at least one attribute.  I add the following line to TestCompany->TestCreate() to get my red bar back:

$this->assertEqual($company->getID(),0);

To return to green I add to my Company class:

protected $id = 0;

function getID() { return $this->id; }

The manager needs a data access object to get the instance of my Company from the database.  I decide my next step is to test and create my CompanyDAO class.  I am thinking now that I want the structure of my tests directory to mirror the structure of my models directory.  I make a mental note that I need to move my TestCompany file into a domain directory and create a testCompanyDAO.php in tests/dao.

<?php

require_once(dirname(__FILE__) . ’/../../simpletest/autorun.php’);
require_once(dirname(__FILE__) .’/../../application/models/dao/CompanyDAO.php’);

class TestCompanyDAO extends UnitTestCase {

     function TestCreate() {

          $dao = new CompanyDAO();

          $this->assertIsA($dao, ‘CompanyDAO’);

     }

}

My test predictably fails.  I add CompanyDAO.php to /application/models/dao:

<?php

class CompanyDAO extends Zend_Db_Table_Abstract

{
    protected $_name
    = ‘company’;
    protected $_primary = ‘id’;
}

Things suddenly got interesting when my test failed again.  This time my test reported that it could not find Zend_Db_Table_Abstract.  Of course!  One of the first things to do when bootstrapping a Zend Framework app is to register Zend_Loader to autoload the necessary Zend objects.  One thing that I didn’t like about the example that the Zend_Test document provided was that it was using a plugin to the controller to bootstrap the Zend app for every test.  I didn’t want to have to do that for such simple tests as checking to see if I created an instance of Company or not.  I decided to create a simple file that mirrored whatever initialization I needed from the Zend Framework for my test files.  I can then include that file in only the specific test files where I need it.  I added bootstrapTestsForZend.php to my tests directory:

// Copy application bootstrapping

define(’APPLICATION_PATH’, $_SERVER['DOCUMENT_ROOT'] .’/application/’);
define(’APPLICATION_ENVIRONMENT’, ‘development’);

set_include_path( $_SERVER['DOCUMENT_ROOT'] . ‘/library’ .PATH_SEPARATOR . get_include_path() );
require_once “Zend/Loader.php”;
Zend_Loader::registerAutoload();

$configuration = new Zend_Config_Ini(
    APPLICATION_PATH . ‘/config/app.ini’,
    APPLICATION_ENVIRONMENT
);

$dbAdapter = Zend_Db::factory($configuration->database);
Zend_Db_Table_Abstract::setDefaultAdapter($dbAdapter);

(For more on how/why this configuration is like it is, see the Quickstart.)

While initially my APPLICATION_ENVIRONMENT is set to ‘development’, I will probably add a ‘testing’ environment to my configuration so that I can create and drop a lightweight data file when running tests without affecting the data that other developers are using to do functional testing with.

I added the following line as my first line in testCompanyDAO.php to get back to green:

require_once($_SERVER['DOCUMENT_ROOT'] . ’/tests/bootstrapTestsForZend.php’);

To test my manager class, which is really the workhorse of my domain model, I added /tests/manager/testCompanyMgr.php.

<?php

require_once($_SERVER['DOCUMENT_ROOT'] . ’/tests/bootstrapTestsForZend.php’);
require_once(dirname(__FILE__) . ’/../../simpletest/autorun.php’);
require_once(dirname(__FILE__) . ’/../../application/models/manager/CompanyMgr.php’);

class TestCompanyMgr extends UnitTestCase {

     function TestCreate() {

          $mgr = new CompanyMgr();

          $this->assertIsA($mgr, ‘CompanyMgr’);

     }

} 

The manager class:

<?php
require_once APPLICATION_PATH . ‘/models/domain/Company.php’;

class CompanyMgr {

     protected $_dao;

}

One of the common methods for my manager classes is to return all instances of the business object it handles.  Normally I should probably test  the following functionality in a number of smaller increments, but for demonstration purposes I am skipping ahead here a bit.

There are currently three entries in the Company table in my development database.  I write my test to assert that when I ask the manager to return all entries that I get three back:

function TestGetAll() {

    $mgr = new CompanyMgr();
    $entries = $mgr->getAll();
    $this->assertEqual(count($entries),3);
}

With my tests truly driving my development I work back and forth between code and running my tests until my resulting manager class looks like such:

<?php
require_once APPLICATION_PATH . ‘/models/domain/Company.php’;

class CompanyMgr {
    protected $_dao;
    
    function getAll()
    {
        $dao = $this->getDao();
        $rows = $dao->fetchAll()->toArray();
        $entries = array();

        foreach($rows as $row)
        {
            $entries[] = $this->createFromRow($row);
        }
        return $entries;

     }

    private function getDao()
    {

        if (null === $this->_dao) {
            require_once APPLICATION_PATH . ’/models/dao/CompanyDAO.php’;
            $this->_dao = new CompanyDAO();

        }
        return $this->_dao;

     }

     private function createFromRow($row)
     {
        $company = new Company();
        if (isset($row["id"])) $company->setID($row["id"]);
        return $company;
    }

}

As I said before, I will eventually take the step to create and tear down my data source (whether a simple file or actual db instance) each time I run the tests.  While developing, I’ve only needed to run one test file at a time.  As I move along, I will add these test files into a test suite.  I will probably add the creation of the data source  at that level.  SimpleTest also includes functionality to use Mock Objects, which I would also like to explore in Zend.  I’ll try to include those concepts as well as a few more specific to Zend Framework like testing a Zend_Form and Zend_Validate.

Slice of Lime “Bake Something!” Party

Wednesday, November 26th, 2008

To get in the Thanksgiving spirit, our Project Manager, Lindsay, organized a “Bake Something!” party. Everyone came to work with a homemade baked good, including two takes on scrumptious apple pie. We turned on some “Thanksgiving music” (not a large selection) and enjoyed a bunch of carbs at the end of the work day.

Thanks for organizing, Lindsay!

Controlled vs. Socially-Driven User Testing

Thursday, November 20th, 2008

Slice of Lime recently launched an incredibly rich and fun website called Big Green Rabbit. The target demographic is children aged 2-8. To ensure that the website was usable, engaging, and fun for this age group, we ran a series of user tests using the application, Silverback.

The Silverback application allowed us to bring laptops on location (into the child’s home) and to use the built in iSight camera to measure the reaction of the child’s face, where they were looking, what they were saying, and where they were clicking. A moderator took notes, but avoided interfering or helping the child if they were stuck.

This process was immensely helpful pre-launch as it brought some usability issues to light that we hadn’t though about. We wound up making major changes to the nav one week before launching to improve the experience right out of the gate. Here’s a small clip of Max bringing Charlie, the Big Green Rabbit, to life. His reaction is priceless:

This user testing was very valuable to us. However, there’s another sort of “user testing” that we’ve seen lately - “Socially-Driven User Testing.” We’ve found that some of our target demographic will take it upon themselves to blog and even post videos about their experience with the websites we build. This sort of data is almost more valuable since it comes in naturally (vs. us going out to actively acquire it in a controlled environment).

Here’s a YouTube video that we found of a girl dancing along to the “Learn a Dance” portion of the Big Green Rabbit site:

We’ve seen this sort of Socially-Driven User Testing before with the Jibbitz site that we built, where V and Cat talked about how “fly” the site was:

While controlled user testing will always be a valuable way for us to collect data, we’ll be sure to look more and more towards social media channels to collect invaluable information as we move forward.

Top of the 9th: Creative Commons hits a homerun.

Thursday, November 20th, 2008

Tuesday night the Slice of Lime office was abuzz with a healthy crowd of interactive pros, newbies, start-ups and students. Thank you all for making it over- we loved catching up on fresh applications and opportunities, as well as demo’ing some of our latest launches. November’s Creative Commons event boasted some of the best conversations we’ve heard yet, and it never ceases to amaze us how much local talent this community holds.

We look forward to seeing you all at next month’s Creative Commons on Wednesday, December 17th. Come join us for a very special video chat with John Allsopp, who will be talking to us about the upcoming Web Directions North Conference, http://north.webdirections.org/program.

In the meantime, join the Creative Commons MeetUp group for information on upcoming events, as well as contact with fellow members: http://webdesign.meetup.com/487/

Slice of Lime at the Adobe MAX Conference

Wednesday, November 19th, 2008

This week, we had the opportunity to attend the Adobe MAX Conference in San Francisco. We got to check out the city and to “level up” our skills around the various Adobe products that we use every day at Slice of Lime.

The major take away for me was represented in the Adobe Keynote on Monday. They are thinking of the world in 3 overlapping areas:

  1. Cloud Computing
  2. Social Communication
  3. Device Independence

With this focus, the conference definitely zeroed in on their Rich Internet Application (RIAs) tools, specifically Flash, Flex, and AIR. Slice of Lime has been doing a steadily increasing amount of Flash and Flex work and our purpose for being at the conference was to extend this knowledge even further.

Adobe also offered some new tools, like Flash Catalyst, which offers a “rapid-prototype” approach to to building web applications and allows for a more cohesive workflow between designers and developers. Again, this seems very much aligned with were Slice of Lime is seeing the industry growing - iterative and highly collaborative development.

Lastly, it was great to hear about advances in Flash search engine optimization and the details on how this is accomplished. Finally, dynamic websites in Flash can start to break away from search engine optimization issues.

All in all, the conference was extremely educational and had a great atmosphere of collaboration. There was much less focus on walking “the floor” and much more focus on learning new things and getting inspired for future project work.

You can see some quick video and photos of our trip in the video below:

Don’t forget to join us next time…

Friday, November 14th, 2008

Just a reminder of our upcoming Creative Commons event on Tuesday, November 18th. In true Thanksgiving spirit, we’re asking everyone to bring canned food items to donate to the needy.

*And don’t forget to join the Creative Commons MeetUp group for information on upcoming events, as well as contact with fellow members: http://webdesign.meetup.com/487/.

Slice of Lime gets Eldora Passes!

Friday, November 14th, 2008

Slice of Lime picked up 4 “No Limits” passes for Eldora, the ski resort just up the road from us in Boulder, Colorado. Employees can enjoy these passes at any time and, yes, to all of our beloved clients, you can use them, too!

Here’s to a great ski/snowboard season!

Slice of Lime takes a private tour of the Denver Art Museum

Friday, November 14th, 2008

One of our new clients, The Denver Art Museum, gave us a private tour last Friday.

Our trip started with a retro lunch at Steubens in downtown Denver. After filling up on chocolate shakes and fries, we headed over to the museum to learn about their philosophy behind their installations.

What struck us most was that the approach to layout and functionality was not too different than the way we approach social websites. The Denver Art Museum has a heavy focus on community interaction. Many of the pieces require you to physically do something in order to fully experience them. There are also plenty of areas that offer the visitor ways to write comments, thoughts, and to create their own pieces of art - much like a blog community would.

We thoroughly enjoyed our visit and to get a chance to look through the eyes of the people driving the exhibits at the museum.

We also thoroughly enjoyed our trip to Pints Pub around the corner from the museum after our tour was done. :-)

Slice of Lime at Pints Pub

Slice of Lime Designer Coffee Mugs

Monday, November 3rd, 2008

One of the things we like to encourage across the board at Slice of Lime is creativity. Creativity presents itself in all aspects of our work from Project Management to Design to Code. We try to find ways to nourish that creativity outside of the world of web technology. A couple of weeks ago, we went to Color Me Mine down the street from our offices to create brand new coffee mugs for work.

We started with picking out our pieces:

…and then got right to work painting:

We got our pieces back today and they turned out awesome! Here’s a run down of everyone’s mugs and their morning drink of choice:

Mike Byrd

Morning Drink of Choice: Coffee, Black

Richard Jones

Morning Drink of Choice: Tea and Chai

Kevin Menzie

Morning Drink of Choice: Coffee, Black

Mike Miller

Morning Drink of Choice: Coffee, Black

Ben Rice

Morning Drink of Choice: Coffee, Black

Jeff Rodanski

Morning Drink of Choice: Coffee with Lots of Cream and Sugar

Travis Silverman

Morning Drink of Choice: Hazelnut Coffee with a Dash of Sugar

Lindsay Ternes

Morning Drink of Choice: Tea and Chai

Nice work everyone!!!

Munchkin Masquerade

Friday, October 31st, 2008

After the launch of the Big Green Rabbit website earlier this week, we Slice of Limers are feeling like kids ourselves. Today, we participated in “Munchkin Masquerade” on the Pearl Street Mall, which is a 3 hour event packed with kids in costumes. Our 3 party pack bags of Hershey’s bars were gone in about 15 minutes as kids snatched them up (with the occasional “trick or treat”). Impressive.

Eight is Great: Creative Commons Gains Momentum

Friday, October 17th, 2008

A warm thank you to everyone whom joined us for last night’s 8th Creative Commons event at the Slice of Lime office. We had an enthusiastic showing of diverse Boulder/Denver talent, and some nostalgic surprise connections.

Boulder Creative Commons

We invite you to bring your ideas and a friend to next month’s Creative Commons event on Tuesday, November 18th. And don’t forget to join the Creative Commons MeetUp group for information on upcoming events, as well as contact with fellow members: http://webdesign.meetup.com/487/

Rally Software Development

Sunday, October 5th, 2008

From pilot projects to distributed, multi-team programs, Rally Software Development’s family of Agile lifecycle management solutions gives teams the visibility and collaboration needed to formalize and scale Agile development practices that deliver high-value software in rapid iterations.

Slice of Lime is responsible for the strategy, design, and development for the new Rally Software Development website.

We started with a strategy process around the new target demographic and goals of the website. One of the core takeaways from this process was that Rally needed to appeal to a broader range of audiences, or “personas”. The main personas that were identified were:

  • Project Managers
  • Developers
  • QA/Testers
  • Product Managers
  • VPs of Development

We also decided that it was important for the website to not only pitch Rally’s products, but to also be a resource for people to educate themselves on what “agile development” really means and how it can benefit a company.

Once the goals and target demographic were established, we began an “Information Architecture” and “Wireframing” process.

The information architecture helped us identify the core pages of both the website and the content management tool that we would be building to manage dynamic content.

The wireframes helped us identify core elements that needed to exist on each page and the priority of those elements.

Once we were in agreement on the information architecture and wireframes, we moved into design.

We went through several rounds of design and candidly discussed which elements from the designs were working the best to match the culture of Rally and to speak to their goals and target demographic.

One of the major design elements on the homepage was the option to browse by “personas”. Using a dropdown menu, a user can view a version of the homepage that speaks to who they are using real Rally client testimonials:

Rally’s product pages offer clear calls to action to Buy, Sign Up for Free, or View a Demo:

Additionally, these pages show relevant links at the bottom for classes, services, blog posts, and downloads that apply to the product they’re learning about at that moment.

Slice of Lime built a custom content management system to control documents, events, and news (among other things) that show up on the Rally Software Development website.

The “Downloads” section of the website doubles as a lead generation tool, passing contact information through SalesForce before allowing visitors of the site to view a document.

Slice of Lime worked with Rally to make sure reporting was setup on each page to track the path users were taking through the site and at which point those users opted to sign up for a free trial or download a document.

The site was coded using “web standards” making it fast loading, easy to update, and indexible by search engines like Google.

There’s plenty more to discover at Rally Software Development and new features are being rolled out almost every week. Check out the site and let us know what you think. This project was challenging and one of our favorites to work on this year.

Slice of Lime featured on BoulderSpace.org, “Inside the Studio”

Monday, September 22nd, 2008

Spacial architecture, interior design, and color play important roles in influencing creativity, inspiration and clear thought processes. Recognizing this, Boulderspace will be capturing architectural and interior design of Boulder’s creative studios over the upcoming months. They’ve kicked off the series by exploring Slice of Lime’s workspace.

Read the full article here

Slice of Lime installs Intense Debate

Friday, September 19th, 2008

Slice of Lime has installed Intense Debate on its blog. According to Intense Debate, this is why they are any blog’s new best friend:

Comment Threading

We built IntenseDebate to improve the dialogue within the comment section. You no longer have to try to follow the maze of conversations going on in the comments by means of “@ username” or “@ comment number.” With Intense Debate the comments are threaded, allowing you to reply directly to an individual comment.

Indented replies at different levels make following the various conversations manageable.

Reply-By-Email

Part of our goal to improve the comment conversation is to make it easier to get involved. Reply-By-Email helps minimize the number of steps between you and your debate. With IntenseDebate you can respond to and moderate your comments with ease via email, even if your on the go. Just because you’re away from your computer doesn’t mean the conversation stops.

IntenseDebate keeps you plugged in.

Importing/Exporting
Look, we know that we’re not your first and we may not be your last comment system, and we’re ok with that. Our comment importers and exporters make bringing your comments with you a piece of cake, so you don’t need to worry about losing a single one.

—–

Intense Debate is TechStars company, an organization that Slice of Lime sponsors that helps start up companies get off the ground through seed funding and menorship. Intense Debate is our recommended commenting tool for all of our clients and we’ve already installed it on many of their blogs. Check it out and see what you’ve been missing.

Big Blue Screen for the Big Green Rabbit

Friday, September 19th, 2008

If you haven’t seen The Big Green Rabbit on PBS, you’re missing out. Slice of Lime engaged with The Big Green Company about a month ago and we’re having a blast getting to know Charlie (The Big Green Rabbit) and Isabelle.

We spent last week down at the Comcast Media Center working on a Big Green Rabbit shoot. We’re having a ton of fun with this project.

Byrd turns 24

Friday, September 19th, 2008

“In da Club” blasted as we delivered Mike Byrd, our amazing Flash/PHP developer, his 24th birthday cake. You’ll notice that Mike, better known as “Byrd”, is reinforcing his nickname with his shirt. You’ll also notice that he seems a bit hesitant to let anyone else near his cake.

Happy birthday Byrd!!!

Slice of Lime iPhone Site

Wednesday, August 13th, 2008

Finally.

Slice of Lime originally included mobile applications and websites as one of our offerings when we started the company in 2001. We built a couple of applications that were well received, such as “Mobile Snow”, which delivered the snow report to your cell phone, Palm Pilot, or Pocket PC in the morning. It received the highest possible rating from Palm and the Flash-driven Pocket PC version was featured in a book entitled “Advanced PHP for Flash.”

Alas, we were about 7 years ahead of our time.

Now, we’re excited to include iPhone web optimization as one of our services. To kick off this announcement, we’ve optimized our own site.

Special considerations need to be taken when building an iPhone optimized website. For example, our contact page featured above is more useful with icons that help you reach us. Tapping the “Find Us” icon opens the Google Maps iPhone application, shows you where we are, and give you directions on how to get to us from your current location.

We’re excited to announce this new service and look forward to building more iPhone optimized websites. To learn more, take out your mobile device and call us at 303.413.0701!

If you don’t have an iPhone, but want to see the site in action, you can go to here.

7th Boulder Creative Commons a Success

Tuesday, August 12th, 2008

Slice of Lime hosted the 7th Boulder Creative Commons this evening. We had a great time getting to know designers and developers in the area as well as some of the folks from TechStars’ companies.

Andrew Hyde took some great pictures of the event that you can see here.

Thanks to all who attended, especially those new to Boulder. It was awesome meeting you. See you next month!

Kevin Costner is a Liar

Tuesday, August 12th, 2008

We had the opportunity to sit on a User Experience panel for TechStars a couple of weeks ago. TechStars is an organization that mentors 10 start-up companies each summer and Slice of Lime is one of their sponsors.

The panel was comprised of my business partner, Jeff Rodanski, and the CEO of Viget, Brian Williams. We covered a bunch of issues around user experience within the context of a startup and used past clients like Jibbitz and PhotoVu as examples.

The main takeaway we wanted people to have was that simply creating the functionality of a website without consideration of target audience and goals can limit your chance of success. In other words, Kevin Costner is a Liar - if you build it, they won’t necessarily come.

In every project we do, we focus on target audience and goals above all else. Whether it’s information architecture, design, or development, we always refer back to these two things.

Goals

  • What is the primary action you want people to take when they come to your website?
  • What do you want people to do before leaving your website?
  • What are your broader company goals?

Target Audience

  • Research your target audience if you’re not already familiar
  • What is you target audience like? How computer literate are they?
  • What are their likes/dislikes?

We usually start our clients off with a questionnaire that focuses on goals and target audience to help us through strategy conversations.

If the project is more complicated, we may also do industry research or focus groups to get more insight into the target audience.

As we get into information architecture and wireframing of a website, we make sure to always reference the goals of the project and the target audience. Is this user flow going to make sense to our audience? Do the elements on this page really address the action our client wants a user to take?

We go through iterations for most steps of the process. When reviewing designs, we recommend our clients not only offer their gut reactions, but that they also collect feedback from people in their target audience.

Focusing on goals and target audience in relation to user experience may seem straight forward - and it is. As obvious as it may seem, we’ve seen companies approach projects with a “functionality-first” approach many times. In our opinion, functionality should support your goals and target audience, not the other way around.

It was a pleasure sitting on the panel and getting the chance to organize these thoughts for the amazing startup companies TechStars has assembled this year. Many thanks to David Cohen for hosting.

Genlighten Logo

Monday, June 30th, 2008

Slice of Lime created the new logo for Genlighten. Genlighten helps you obtain copies of crucial genealogical source materials from local “lookup providers” at surprisingly affordable rates.

We started the project with a strategy conversation to help us better understand Genlighten’s core demographic as well as the philosophy behind the name itself. From there, we decided to focus on a logo that would relate to genealogy as well as the word “enlighten” that is hidden within the name itself.

We started with a wide range of logo options for Genlighten to choose from.

While hesitant to use a tree or leaf image at first, we all decided that this would be the best way to communicate that this is a genealogy-focused site. What we instead played with was ways to bring “enlightenment” into the picture.

We landed on the final logo that depicts a tree with an aura around it. The leaves are almost little flames in themselves which bring to mind “light” while the glowing tree taps into the more spiritual interpretation of “enlightenment.”

Genlighten was very happy with the end product and went on to write their own blog post about their experience working with us. You can read that blog post here.

Slice of Lime Volunteers for Wish for Wheels

Monday, June 2nd, 2008

Slice of Lime created the website for Wish for Wheels, an organization that gives kindergarten kids bikes on graduation day. To fully appreciate what they did and to get involved even more, we took the day off to volunteer at a “give away”.

The kids were amazing and it was extremely rewarding to see the looks on their faces when they realized that the bike was for them to keep. Congrats to the Wish for Wheels staff, University Bicycles, and the Slice of Limers for making this a success!

You can see more pictures from the day on our Flickr page here or on the Wish for Wheels page here.

Jibbitz story featured on CNBC

Thursday, May 29th, 2008

It always puts smiles on our faces when we see the much deserved attention that Sheri and Rich Schmelzer get for Jibbitz. Slice of Lime built the original Jibbitz website, variations on the Jibbitz website, and has since created the Jibbitz Stylizer, a fun Flash application that allows you to build out your Jibbitz creations to share with friends or purchase. Soon after building the original site, Jibbitz sold to Crocs for $20 million.

The article and video (seen above) highlights their amazing success story. Congratulations Sheri, Rich, and team!

Slice of Lime Podcast Episode 3: Premier Athletic Supply

Monday, May 12th, 2008

In this podcast, Slice of Lime volunteers for Wish for Wheels, shows off their work on Premier Athletic Supply, and takes an educational trip to Dave and Busters.

Slice of Lime recognized as the 17th fastest growing company in Boulder County

Monday, May 12th, 2008

Slice of Lime was named the 17th fastest growing company at the Boulder County Business Report Mercury 100 Awards last Friday. We’re especially proud to receive this award for 3 consecutive years, placing 4th in 2006 and 7th in 2007. Many thanks to our amazing clients and the congratulations to all of the Slice of Limers!

Premier Athletic Supply

Monday, May 5th, 2008

Slice of Lime created the strategy, design, and development for Premier Athletic Supply. Premier Athletic Supply provides their customers with the best softball, baseball, and football products on the market.

We started the project with a strategy conversation to learn more about the company and the target demographic. From there, we were able to put together information architecture and wireframes for the website. We also agreed on the unique approach of allowing users to browse for products based on the exact position that they (or their kids) play.

During the information architecture process we captured the structure of the site as well as the administration tool that would manage their inventory.

We decided to build the store experience inside Flash so that no page-refreshes occurred. This required that we make good use of wire-framing different instances of the store before jumping into design.

Based on the information architecture and wireframes, we brought Premier Athletic Supply through several design rounds before landing on a final direction.

After choosing a sport, the user is presented with this screen which allows them to browse by position. Rolling over the red dots shows the name of each position.

Clicking on a position takes the user to a listing of all products related to that position.

Products can further be filtered using 3 pull-downs on the top right for product type, manufacturer, and age group.

From the product detail page, a user can add the product to the shopping cart. The shopping cart on the right is updated in real-time so the user never has to leave this page. It’s simple to continue shopping without being disconnected from the overall experience.

On the back-end of the website, we setup an administration tool that connects with Premier Athletic Supply’s point of sale service and allows them to assign images to their products.

Premier Athletic Supply knows everything there is to know about sporting goods. To reinforce this, we created a blog that makes it easy for them to educate their customers about the proper use of the equipment that they sell.

This was a great project for us to work on and a good example of how Flash can create a smooth e-commerce shopping experience.

For a two minute walk-through of the site, watch the video below:

Slice of Lime named to The Boulder County Business Report’s Mercury 100 List for the 3rd year in a row

Tuesday, April 22nd, 2008

Slice of Lime has been named to The Boulder County Business Report’s Mercury 100 List for the 3rd year in a row. The Mercury 100 event will honor the top 100 fastest-growing private companies in Boulder and Broomfield counties for the past year. Congratulations to the Slice of Lime team and thank you to our wonderful clients.

Lunch with Wish for Wheels

Wednesday, April 9th, 2008

Brad and Katie from Wish for Wheels treated the Slice of Lime team to lunch at The Rio. This was to thank us for creating their new website. Founded in 2004, Wish for Wheels is determined to make a difference for children by providing new bikes and helmets to kindergarten kids. At their first giveaway, it became clear to them that the bikes do bring health and happiness into these children’s lives.

We’re also looking forward to volunteering on May 14th and seeing the expressions on the kid’s faces when they see their brand new bikes.

Wish for Wheels is currently accepting volunteers and donations.

Zenie Bottle Logo

Monday, April 7th, 2008

Zenie Bottle Logo

Slice of Lime designed the Zenie Bottle logo. Using the information collected during a Scope Discovery project, we produced several options for the Zenie Bottle logo.

Zenie Bottle Logo Comps

We landing on an icon that represented the Zenie Avatars that would soon be incorporated into the site. The swirls placed inside the bottle refer to the various items that can be placed within the “virtual bottle.” A clean and fun logo font treatment was created featuring the word “zenie.”

Richard turns 30

Saturday, April 5th, 2008

Richard’s Birthday

We started the morning off right with a sugar-filled “Madagascar” cake in celebration of our Lead Web Developer Richard’s birthday. The ensuing sugar rush afterwords was better than cup of coffee we’ve ever had. Perhaps we should have cake every morning?

Happy 30th, Richard!

Zenie Bottle

Friday, April 4th, 2008

Zenie Homepage

The Zenie Bottle project started when the Zuzingo team walked into our offices, placed a interesting looking bottle on the table, and stated that they’d like to build a web experience around that bottle. The target would be mid teens to early 20s and the website would be a place to both buy bottles and to create “virtual bottles”. Virtual bottles would be online representations of the purchased bottle that would include any sort of message the bottle owner wished.

Zenie Table

From there, we brought Zuzingo through a “Scope Discovery” project to help better define the project, target demographic, and features that would be intriguing to their audience. Over several meetings, we had reached a consensus on the strategy of ZenieBottle.com.

Zenie Bottle Scope

Our first assignment was to create the Zenie Bottle brand. Using the information collected during the Scope Discovery project, we produced several options for the Zenie Bottle logo.

Zenie Bottle Logo Comps

We landing on an icon that represented the Zenie Avatars that would soon be incorporated into the site. The swirls placed inside the bottle refer to the various items that can be placed within the “virtual bottle.” A clean and fun logo font treatment was created featuring the word “zenie.”

Zenie Bottle Logo

From there we created a simple system for tracking scope updates and deletions using notecards and a whiteboard. As we continuously updated the board, we worked through the back-end and front-end information architecture and wireframes. After several rounds of reviews of information architecture we were ready for design.

Zenie Bottle Information Architecture

We brought Zuzingo through several rounds of design reviews before landing on the final direction. Our main objective was to entice users to explore the site right from the homepage by showcasing virtual bottles. Once hooked, we offer information on how a user can obtain their OWN Zenie Bottle.

Zenie Bottle Design Comps

As we worked through design, we were also developing the user interface. It was agreed that a key part of this project would be an engaging user experience both in creating virtual bottles for the world to see AND in viewing those bottles.

We created a rich AJAX application for building your own virtual bottle. It allows a user to add YouTube videos, photos from their desktop, photos from Flickr, messages, text messages from their cell phone, music, scenes, and charms with just a few clicks.

Zenie Bottle Builder

We used Flash to create an extremely rich experience when a bottle is opened. Items placed inside the bottle float down the screen and can be clicked on to be brought into focus.

Zenie Bottle Design

We also added in the ability to add comments, embed bottles as widgets on other sites like MySpace, and to rate bottles.

Zenie Bottle Widget

There’s plenty more to explore in terms of features and what users have created at Zenie Bottle.com. We invite you to visit Zenie Bottle.com today and check it out for yourself! This was a challenging, fun, and incredibly rewarding project to be a part of.

You can also view our podcast which showcases Zenie Bottle here.

MyAlohaVibe

Friday, April 4th, 2008

MyAlohaVibe Homepage

After creating the branding and sub-branding for “WhatsMyVibe”, Slice of Lime created a template for “MyAlohaVibe.”

MyAlohaVibe.com is an online activity guide that serves as a fun and personalized guide to the State of Hawaii.

We started the project by presenting several design directions that would fit within their WordPress template structure.

MyAlohaVibe Comps

After several rounds of reviews, we landing on a design that matched the new brand color scheme and prioritized the goals of the site; to collect user registration and make it easy for people to find the perfect restaurant.

We’re looking forward to seeing how the WhatsMyVibe brand and websites mature over time.

What’s My Vibe Logo

Friday, April 4th, 2008

What’s My Vibe Logo

Slice of Lime created a family of logos for “What’s My Vibe,” a company that will host a series of region-specific travel websites. To start, the websites will feature local restaurants, complete with user ratings and comments.

While each region will ultimately have it’s own logo, we wanted ALL logos to maintain a familiar look and feel.

We created a “vibe” icon and chose a font that remains consistent across the entire family of logos.

The tagline (”the restaurant guide of las vegas,” for example) and featured location (”MyVegasVibe”, for example) can easily be changed without altering the overall feel of the brand.

The multi-colored “Vibe” in all of the logos serves as a color palette for the site itself. Depending on the feel of the website, locations can choose a primary color from one of the four colors.

Slice of Lime also also created a WordPress template for “MyAlohaVibe”, the Hawaii version of What’s My Vibe.

Wish for Wheels

Thursday, April 3rd, 2008

Wish for Wheels Home

Slice of Lime worked pro-bono to create the strategy, design, and development for Wish for Wheels. Founded in 2004, Wish for Wheels is determined to make a difference for children by providing new bikes and helmets to kindergarten kids. At their first giveaway, it became clear to them that the bikes do bring health and happiness into these children’s lives.

We started with a strategy conversation and identified some high-level goals. Wish for Wheels wanted the website to show off the end-result and spirit of their program through video and images. A close runner up to this goal was to make it easy for visitors to the site to donate.

We created a simple information architecture for Wish for Wheels, renaming a lot of their existing nomenclature to be more straight forward. “Grease the Wheels” became “Donate”, for example.

From there we created a basic wireframe for the homepage outlining the core elements we felt were important. One of the main elements on the homepage would be a video featuring a story done on them from a local news station.

Wish for Wheels Wireframe

We decided to create some custom, fun, cartoon style icons for the navigation items. We felt that this would add that playful element Wish for Wheels was originally going for with their navigation. “Donate” was given a bicycle pump icon, for example.

Wish for Wheels Icons

Using SlideShowPro and SlideShowDirector, we setup an easy to use Flash photo gallery for Wish for Wheels. This will make it easy for them to continue to add photos year after year onto the website.

Wish for Wheels Photos

This was a rewarding project to work on and a cause I think we can all relate to. Slice of Lime will be taking a day to volunteer with Wish for Wheels. We’re looking forward to seeing the smiling faces on the kindergarten kids as they discover their graduation surprise!

Pedestrian Shops

Thursday, April 3rd, 2008

Pedestrian Shops Home

Slice of Lime created the strategy, design, and development for Pedestrian Shops. Pedestrian Shops has been family owned in Boulder, Colorado for the past 36 years. They pride themselves on offering the world’s most comfortable brands of footwear and encourage their customers to enjoy life and take a walk.

We started the project by focusing on strategy. It became clear through meeting with Pedestrian Shops that a core differentiator was their connection with the “Boulder-lifestyle.” Eco-friendly, laid back, and outdoorsy. This gave us a good start as we explored different ideas during the information architecture process.

Pedestrian Shops Site Map

Pedestrian Shops Wireframes

We decided that one way to set the site apart from others would be to play up their focus on the Boulder lifestyle. This would involve an earthy approach to the design. We created a navigation path for users to browse the site with terms like “Hiking and Trail Running”,”Walking”, and even “Vegan.”

Pedestrian Shops Lifestyle

We also created a system that made it easy for visitors to combine different search criteria to find the perfect footwear. For example, we felt that there should be no reason a visitor couldn’t search by gender, type of footwear, brand, lifestyle, and price all at the same time.

Pedestrian Shops Search

On the back-end, we tied their inventory directly into their existing point of sale system. We also added some extra features through a password-protected administration tool that allows Pedestrian Shops to add things like color swatches to footwear. In the example below, a visitor would click on the color Croc that they want and the main image above would immediately show the choice they made.

Pedestrian Shops Swatches

Lastly, to maintain a connection with the Boulder community, we established an easy to update blog for Pedestrian Shops. This is where they can talk about their environmental approach to business, make announcements, and show the most recent press that they’ve gotten.

Pedestrian Shops Blog

It was an honor to work on this project with Lauren and Richard Polk at Pedestrian Shops. Their business has been a staple in Boulder for over 30 years and it was our pleasure to create a website that reflects their culture and optimizes their business.

The Final Countdown

Thursday, April 3rd, 2008

It’s a Slice of Lime tradition to cue up the live performance of Europe playing “The Final Countdown” and to crank the volume whenever a new site launches. We just played two in a row today for Wish for Wheels and Premier Athletic Supply.

Something about that song (and the cheesy video) that puts a smile on your face. Congrats everyone!

6th Boulder Creative Commons a Success

Monday, March 31st, 2008

Boulder Creative Commons

Thanks to all those who attended who made our 6th Boulder Creative Commons so interesting. We had a good mix of designers and developers at the event who enjoyed microbrews and finger-food over great discussion. We plan to make this a regular monthly event.

V and Kat show how “fly” the Jibbitz Stylizer is

Tuesday, March 18th, 2008

It really doesn’t get any better than this in terms of customer feedback. V and Kat host the vkat23 Channel on YouTube and are the self proclaimed “craziest kooko ppl in the world.” They put big smiles on our faces as they talked about the Jibbitz Stylizer and showed off how easy and fun it is to create your own Jibbitz masterpiece - actually, we think they preferred the phrase, “this is so fly.”

The Stylizer is a project that Slice of Lime completed in 2007 and was recently highlighted in the Boulder County Business Report. You can read about our process in creating this section of the site for Jibbitz here.

Thanks V and Kat! We’re honored that you’re enjoying the Stylizer so much that you made it a part of your show. That, dare we say it, is “super-fly”.

Slice of Lime’s work on ZenieBottle.com featured in the Boulder County Business Report

Friday, March 14th, 2008

zuzingoarticle.jpg

The Zenie Bottle project that Slice of Lime recently completed is featured in the Boulder County Business Report in an article titled, Zuzingo bottles media on social networks.

Some of interesting quotes from the article include:

“When it comes to social networks, some can be all about communications, but ours is about expression,” [Paul Berberian] said. “It’s a multimedia collage about your state of mind. It’s a different way to display content.”

“A large part of the success of the site will be people putting the widgets on their Facebook page or their own blogs,” [Kevin] Menzie said. “But from our perspective what was important was to make the site as engaging and beautiful as possible.”

For more information on our work on ZenieBottle.com, you can view our podcast here.

Newest Slice of Lime employee, Mack the Fish

Friday, March 14th, 2008

Mac the Fish

It’s a pleasure to welcome our newest employee, Mack the Fish, to the team. Mack has setup his office inside of the frame of an old Macintosh Classic computer. He turned down our benefits package and instead is only requesting fresh water and fish flakes for compensation.

Welcome to the team, Mack!

Slice of Lime sponsors “breastFEST” for the 2nd year

Friday, March 7th, 2008

breastFEST

Slice of Lime is sponsoring “breastFEST” again this year. The picture above shows one of Slice of Lime’s web designers, Travis Silverman, next to the eye-catching poster he created for the event. The posters can be seen up and down the Pearl Street Mall today.

breastFEST features music, poetry, and dancing at Trilogy and on March 8th at 9pm. The event supports YES! (Young Empowered Survivors). YES! is a support group for young adults in all stages of cancer diagnosis, treatment and recovery.

It’s an honor to be a part of the event again this year. Last year’s experience was amazing. We’d highly encourage you to check it out Saturday night.

Slice of Lime Offsite Meeting

Thursday, March 6th, 2008

Slice of Lime Offsite

Kevin and Jeff spent the day before Venture Capital in the Rockies (an event Slice of Lime sponsors every year) doing their “offsite meeting” in Beaver Creek. We reflected on the past year and what’s to come in 2008. This picture shows the magnificent view from our room as we worked through numbers and goals all day. Not a bad backdrop.

We’d like to thank all of our past and present clients for your business. We’re having a blast.

Slice of Lime Podcast Episode 2: TechStars

Wednesday, March 5th, 2008

Our second podcast takes place at Venture Capital in the Rockies, an event that Slice of Lime sponsors every year. We interview David Cohen, the Founder of TechStars. Kevin and Jeff then discuss the work Slice of Lime did on the new TechStars website.

You can view the video by clicking here.

Happy Birthday Cookie

Tuesday, March 4th, 2008

Kevin Cookie

Our CEO, Kevin, celebrated his birthday today in Slice of Lime style by heading to the Rio for lunch and finishing off with a surprise giant cookie. By the time this picture was taken, all that was left on the cookie was “Happy Birth…”, which is still more or less to the point.

Foundry Group

Tuesday, March 4th, 2008

Foundry Group Homepage

Foundry Group is a venture capital firm focused on making investments in early-stage information technology, Internet and software startups. Their passion is working alongside entrepreneurs to give birth to new technologies and to build those technologies into industry-leading companies.

Slice of Lime was responsible for the strategy, design, and development of the new Foundry Group website. We started the project with a strategy meeting. From there we highlighted the major goals of the website; to establish the team as approachable and friendly (which they are) and to be a valuable source of information to those seeking venture capital. We agreed that the site should allow for a great degree of transparency into their business.

Foundry Group Blog

In order to achieve Foundry Group’s goal to become a valuable resource, we created “The Foundry Group Blog” using Movable Type. Using the blog, any one of the partners can create articles related to the venture capital world. Alongside the blog, we also included the latest articles from “Ask the VC”, another website designed and developed by Slice of Lime, which fields questions posed to the Foundry Group team. Both blogs can easily be searched by leveraging one of Foundry Group’s investments, Lijit.

Foundry Group Team

Another way to achieve transparency was to put Foundry Group’s team front and center. A photo of the entire team is featured on the homepage and the “Team” page offers each partner’s direct email address and full bio.

Foundry Group has already raised a $225 million early stage Venture Capital Fund and has begun making investments.

This was a rewarding project for us to work on and a great opportunity to work even closer with the extremely intelligent folks that make up Foundry Group.

Slice of Lime’s strategy, design, and development for the Jibbitz “Stylizer” highlighted in the Boulder County Business Report

Friday, February 29th, 2008

Slice of Lime recently created the Jibbitz Stylizer. The Stylizer is a section of the Jibbitz website that makes it fun for kids to decorate any color Croc with their own set of Jibbitz and send their creation to a friend, print it off, or add it to a shopping cart.

Some notable quotes from the article include:

“The idea was to create a site that is engaging to kids but trustworthy enough for parents to click that buy button,” Menzie said. A shoe doubles as a shopping cart, allowing parents to buy their child’s creation.

“We start off any client with a big strategy session,” Rodanski said. The company analyzes its client’s goals and needs and help the client build a business strategy. Potential clients often bring up Jibbitz when talking with Rodanski.

Slice of Lime, in business for almost eight years, strives to build a sense of teamwork with its clients while building their Web sites, Rodanski said, and the company has carved out a niche working with startup companies.

You can read the full Boulder County Business Report article here.
You can read our own blog posts on the project here.

Slice of Lime to Sponsor Venture Capital in the Rockies 2008

Monday, February 25th, 2008

Slice of Lime is sponsoring Venture Capital in the Rockies (VCIR) for a fourth year this week in Beaver Creek. We were responsible for designing all collateral, promotions, and the website. Slice of Lime’s work on Venture Capital in the Rockies has resulted in incremental attendance records every year.

Slice of Lime Podcast Episode 1: Zenie Bottle

Wednesday, February 13th, 2008

We kick-off our first podcast at Boulder Creative Commons, a networking event hosted at the Slice of Lime offices about once a month. Kevin and Jeff discuss one of Slice of Lime’s latest projects, Zenie Bottle.

You can view the video by clicking here.

Slice of Lime sponsors Wish for Wheels

Wednesday, February 6th, 2008

Wish for Wheels

At Slice of Lime, we take on one or two pro-bono projects every year. Recently, an organization named Wish for Wheels approached us and we couldn’t resist. They are a local non-profit that gives brand new bicycles to underprivileged kindergarten kids on graduation day.

During our kick-off meeting yesterday, they started talking about how rewarding it is to see the expressions on the faces of these kids as they exited graduation and found a parking lot full of brand new bikes! I couldn’t help but think of some 8 millimeter footage my parents took of my first bike. I found the video and posted it here. There’s a special place in our hearts for the memory of our first bicycles which I’m sure many of us share.

We’re excited to get started on this project and also to volunteer on graduation day!

Having fun with Zenie Bottles

Tuesday, January 29th, 2008

zeniephotoshoot.jpg

The Slice of Lime team had some fun this afternoon doing a video shoot for Zenie Bottle. We’ll be talking a lot more about Zenie Bottles (our latest client) on the blog soon, but one of their coolest features is how they swirl inside when you shake them.

Mike and Kevin had fun setting up the shot with the perfect lighting while trying not to be spotted in the reflection of the glass.

View more pictures of the shoot here.

TechStars

Friday, January 25th, 2008

TechStars Homepage

TechStars is an organization that accepts 10 startup companies every summer and offers seed funding, mentorship, and great connections. Slice of Lime is a 2008 TechStars sponsor and we will be offering our time to each of the accepted companies to talk about their web strategy, design, and development. Additionally, we were brought on to create a new website for TechStars.

We started the project by sitting down with David Cohen, the founder of TechStars, and discussing the overall strategy and target demographic of the website. It was clear that a strong call to action to apply was the most important. Featuring the amazing TechStars mentors and organization details were a close second. We also felt it was important to use pictures from the previous year to help show what the summer is really like. We decided to stay away from polished photos and leaned towards photos showing the 2007 TechStars in action.

TechStars Information Architecture

We established a simple information architecture and spent time refining the homepage wireframe, the most important page of this site.

Since one of David’s requirements was to manage the content on most of the pages, we agreed that WordPress would be the best tool for the job.

TechStars Mentors

TechStars Mentors

Slice of Lime configured WordPress so that David could manage mentors, for example, in one place. The website would then instantly create an individual mentor page, a page that listed ALL of the mentors, and a scrollable mentor list on the homepage.

TechSrars socialThing!

Leveraging the same features of WordPress that we used for mentors, Slice of Lime configured WordPress so that David could also manage previous TechStars companies. With a few clicks, company descriptions, images, Flickr photos, graduation year, RSS feeds, and even Slice of Lime’s job listing application, TopShelf, can be added to the site.

The site was fun to work on and reinforced our appreciation for WordPress as more than just a blogging tool. We’re looking forward to getting to know the new 2008 TechStars!

TechStars implements Slice of Lime’s job listing web application, TopShelf

Friday, January 25th, 2008

TechStars and TopShelf

TechStars, an organization that helps 10 companies every summer get their startup idea off the ground, has implemented TopShelf, Slice of Lime’s job listing web application.

The application was a perfect fit as they needed a way for their past companies to list job openings on the TechStars website. Each company created an account on TopShelf and the widget code was entered into WordPress for each company page. Since the widget is a simple bulleted list, it was easy for TechStars to style the job listings to match the look and feel of the rest of the site.

5th Boulder Creative Commons a Success

Thursday, January 24th, 2008

5th Boulder Creative Commons

Slice of Lime hosted the 5th Boulder Creative Commons last night. We had about 35 web professionals in attendance and enjoyed great conversation over beer, chips, and cupcakes. Jeff and I also kicked off our first video podcast at the event which will be posted on the blog soon.

Stop by at our next event and check it out. You can learn more about the group here.

WordPress:101 – A beginners guide to using WordPress

Thursday, January 17th, 2008

by Mike Miller, Web Designer

Do you like to visit blogs on the web? Are you not sure? Chances are, you have several bookmarks saved that are powered by blogging software. There’s also a good chance several of those sites are powered by WordPress- a popular, full-featured blogging tool that we often utilize for our client’s blogs. A big reason for its popularity is that it’s very easy to use and manages posts, users, and more.

But, like any software, there is a learning curve required to understand how to maximize its benefits. This article will introduce you to WordPress’ back-end administration and get you blogging in no time!

This article covers the following topics:

  • Admin Overview
  • Adding/Editing users
  • Writing/Managing Posts

Admin Overview

WordPress’ back-end administration app is where you’ll write, manage, and edit all your posts, comments, users and more. To get started, you’ll want to access the WordPress admin section, and log in.

WordPress Login

Once you’ve logged in, you’ll be presented with the Dashboard, a quick way to see new activity on your blog such as posts, comments, and stats, as well as activity in the WordPress community. There are also helpful links to WordPress documentation and support.

Across the top of the admin app you’ll see the title of your blog with a link to view the site and the WordPress admin navigation with several tabs running across the screen. It’s a lot of tabs, but as an admin you get to see everything and the kitchen sink! (If you plan to have additional people contributing to your blog, you can assign them different user roles, which helps simply the navigation they see quite a bit.)

WordPress Admin - Dashboard

In your daily routine you’ll only be using a handful of these tabs, but lets review them all to give an idea of what they do:

  • Dashboard - Your site at a bird’s eye glance
  • Write - Add new posts to your blog
  • Manage - Review/Edit posts, categories, uploaded files, and more
  • Comments - Review/Edit all comments that have been added to your blog
  • Blogroll - Add links to other blogs that you’d like your visitors to know about
  • Presentation - Change the look and feel of your blog
  • Plugins - Install free plug-ins to further customize your blog
  • Users - Add/Edit users on your blog including administrators, editors, writers, and more
  • Options - An advanced area to manage the way WordPress handles your blog

Lets start in the Users tab. (If you don’t plan on having multiple users, you can skip to the Write section.)

User Management

The Users tab lets Administrators add and edit users on your blog. There are several different user roles available, which gives you the ability to scale your blog from a small, personal blog, to a large, web magazine with multiple authors, editors, and contributors.

WordPress Users Tab

Let’s review the five different types available so you know how to assign the right role to the right person:

  • Administrators - Administrators have access to every option in WordPress
  • Editors/Authors - Editors and Authors handle the publishing/editing of posts, and comments on your blog. They can see the Write, Manage, and Comments tabs; all other tabs are only available at the Administrator level. Editors have the additional ability to manage static pages and categories.
  • Contributors - Contributors are able write and save posts, but they can only submit them for review, they can’t publish to the site. Contributors can see the Manage and Comments tabs, but are only able to view items, not edit.
  • Subscribers - Subscribers can only see their profile. The subscriber role is if you require visitors to register to post comments or for visitors who comment often and want to save their info on your blog.

We recommend the Author role for most situations. Authors have no restriction to write, edit, and manage the content on your blog, but aren’t burdened with the more complicated aspects available in WordPress.

Writing Posts

When you first click on the Write tab, you’ll see the Write Post page. There is also a Write Page tab in the sub-navigation, which is only available to Administrators and Editors. WordPress defines pages as static content that won’t change often, such as About pages. For this article, we’re going to concentrate on the Post page.

WordPress Post Editor Page

The first thing you should see is text boxes for your Post’s title, content, and tags in the main content area. This is where people will be spending most of their time, but other options very important to the posting process run along the side. Let’s review the post sidebar:

  • Categories - select one or more categories to make it easier for visitors to parse and search content. Categories are created outside of the post in the Manage tab.
  • Discussion - set whether you want comments and/or pings for the post. Comments allow visitors to respond to the post; Pings are a list of other sites that are linking to your post.
  • Post Password - lets you password-protect the post.
  • Post Slug - lets you customize the way the post appears in the URL, making it easier for bookmarking. For example, typing my first post into the slug field will appear as http://www.mysite.com/blog/my-first-post/.
  • Post Status - lets you set the post as published, pending, draft or private. This is an important option for authors. If they’re writing a long post, they’ll want to set it as draft to prevent inadvertently publishing a work-in-progress! This also applies if a published post needs major editing. Setting it to draft will prevent visitors from seeing the post.
  • Post Timestamp - lets you define the date you want the post to appear as published. The timestamp defaults to the current date of when the post was first written.
  • Post Author - allows authors, editors, and administrators to select the author of the post.

Moving back to the main content area, lets create a post! Type what you’d like your title to be. In this case, we’ll type: My First Post. Next, move to the post area, where you add all the content for your post.

Post Title

There are two tabs: Visual and Code. The Visual tab is a WYSIWYG editor (What You See Is What You Get) that has common text formatting options similar to word processing applications, as well as other options like adding links, and spell checking.

Visual Post Editor

The Code tab is where you copy and paste html code for images, YouTube videos, widgets, and more. If you’re copying embed code from an external site, you’ll want to make sure you paste it in the Code tab or else WordPress will render all the code as plain text!

Code Editor

On the Visual tab, add a few lines of text, formatting however you wish. Then, click the Save & Continue Editing button below the tags field.

Save, publish buttons

Once your post saves, a preview link will appear at the top-right of the post field. You can click this link to see how your post will look to visitors.

Preview Button

Now let’s move to the Tags field below the post area. Tags are keywords relevant to the subject of your post. If your post was about WordPress you would add the following tags: blog, blogging, posts, comments, etc.

Tags Field

When you publish, WordPress will automatically convert the words before the commas into links that users can click on to see other posts on your site with the same tag. If they clicked blogging, they would see all posts that are related to blogging.

Tags on live site

That’s all you need to create a simple post! At this point, you could click Publish, and add your new post to your blog. But what if you want to upload an image to add to the post?

Below the Tags field is the Upload section. This gives writers a simple way to upload images to the web server and then insert them into their posts. Uploading is simple: select the file from your desktop, add a title and description, and then click the upload button.

File Uploader

Once the file has uploaded to the server, WordPress will switch to the browse tab.

File Browser

This tab contains code to add the image to the post. There are 3 options to choose from:

  • URL - the direct path to the image
  • Thumbnail linked to file - copy and paste this code into the Code tab to create a thumbnail of the image that links to a larger version.
  • Thumbnail linked to page - copy and paste this code into the Code tab to create a thumbnail of the image that links to a new blog page with a larger version of the image.

You can also use the Browse All tab to see all images uploaded to your web server. When you click a thumbnail, it will show the 3 code options for linking to the image. Below the Upload/Browse section are several more panes for advanced options. We’ll cover these in another article, for now, click Publish and add your first post!

Managing Posts

Now that you have a live post, you may want to edit the text, tags, categories or other options. You access published posts through the Manage tab.

Manage Tab

In addition, there are several other types of content you can manage:

  • Posts - View, edit, delete published posts. Available to Admins, Editors, Authors, and Contributors. Contributors will only be able to view published posts.
  • Pages - View, edit, delete published pages. Available to Admins and Editors.
  • Uploads - Edit, delete uploaded files. Available to Admins, Editors, and Authors.
  • Categories - Add, edit, delete categories. Available to Admins and Editors.
  • Files, Import, Export - Advanced options only available to Admins.

To edit a post, click the edit link of the post and it will take you to the Write Post page. From here, you can make any changes needed and click Save to save your edits. Note that this will update the blog immediately if the Post Status is set to published.

Summary

You should now be able to manage users, add posts with categories, tags, and uploaded images, and manage posts that have been published. This is just scratching the surface of WordPress and its features, but should give you all you need to know for a successful blog!

Slice of Lime adds job landing pages and custom URLs to TopShelf

Wednesday, January 9th, 2008

Slice of Lime’s job application, TopShelf, rolled out some new features today.

TopShelf Landing Page Choice

Now, jobs can be set to link to a default TopShelf landing page or a specific URL. This means that when a visitor clicks on a job listed in the TopShelf widget, they will either be taken to TopShelf or a page of your choice. The custom URL is useful for companies that already have job listings on their site, but would like a widget that can be installed on various blogs and websites that points back to their site.

TopShelf Job Landing Page

The default landing page is clean and lists your company name, job title, location, description, and application email. If you have more than one job listed, the other jobs will be listed on the right side of the page.

We have plenty of new features planned in the coming weeks and months. Start playing with TopShelf and send us your feedback.

Georneys Logo

Monday, January 7th, 2008

Journeys Logo

Slice of Lime created the logo for Georneys. The color of their product, a wristband for kids that helps identify them if they are lost, is reflected in the logo. We used bare feet to represent a child’s journey and the tagline “safe journeys” to support Georney’s mission and brand.

Slice of Lime Launches TopShelf

Monday, January 7th, 2008

TopShelf Homepage

Slice of Lime launched its first internal web-application today, TopShelf. TopShelf makes it easy to manage your job openings and to place a widget with those jobs on any website.

This project is part of an initiative by Slice of Lime to explore Agile Development methodologies. This first iteration of TopShelf took 8 hours and includes a basic set of features. As time goes on, we will incorporate customer feedback and our own list of enhancements into small iterations.

Sign up today and send us your feedback.

TopShelf

Monday, January 7th, 2008

TopShelf Homepage

Slice of Lime is proud to announce its first internally-built web-application, TopShelf. TopShelf makes it easy to manage your job openings and to place a widget on any website.

We decided to build the app for two reasons.

  1. A client needed it: A new client, TechStars.org (new site will be launching soon), needed a tool that allowed multiple companies to manage jobs in one site. The TopShelf application and widget makes it easy to do this and to customize the job listings using a local stylsheet.
  2. We’re moving towards Agile Development: More and more of our projects are falling into the “web application” category and have much larger scopes than projects we did 3 or 4 years ago. As such, we’re finding that an Agile Development approach may be more appropriate in these cases (building websites in several iterations vs. all at once). TopShelf launches today with a very simple set of features and is fully functional. From design to final code, it took 8 hours. However, we have a large laundry list of ideas that we will be rolling out in the following weeks and months. This gets the application out to the public faster and allows us to incorporate real feedback into our iteration decisions.

TopShelf Job Listing

TopShelf allows you to manage a list of your job openings.

TopShelf Job Details

Job Details are simple and include Job Title, Location, Description, and Contact Email.

TopShelf Widgets

The most useful function of TopShelf is the Widget. Any user can copy this code into their corporate website or blog (or both!) and their job listings will be presented as a bulleted list. This list can be styled using a local stylesheet so that it matches the look and feel of any website it is placed on.

Stay tuned for more enhancements to our TopShelf application as time goes on. There’s a lot that we have planned. For now, please sign up and send us your feedback!

Georneys

Friday, January 4th, 2008

Georneys Homepage

Georneys is a company that was formed to provide location services for lost children. The system uses an ID (shoe tag or ID card) with a number and website imprinted on it. If a child is lost, the person who finds them can visit the web site and retrieve the parent or guardian’s contact information.

Slice of Lime was brought on to help with the overall concept and to create the design and initial code to pass off to their internal development team.

Georneys Information Architecture

We started with a few strategy conversations which lead to the above Information Architecture, outlining each page of the site and high-level functionality.

Georneys Wireframes

From there, we created “wireframes” which captured the core elements needed for marketing and application oriented pages.

Georneys Inside Page

Using those wireframes as a blueprint, we brought Georneys through three rounds of design reviews, ultimately landing on a friendly color scheme that featured families having fun. We felt that it was important to focus on the united family versus the fear of losing a child in our image choices.

Once the design was approved, we coded the site using web-standards (XHTML and CSS). This will make the site easy to update going forward, easier to find via search engines, and faster loading. It also lends itself to mobile devices, an area that Georneys wants to eventually get into.

Once the presentation layer of code was complete, we passed it off to the internal development team at Georneys. From there, they implemented their proprietary back-end code using the styles we had created for them.