Design Pairing: Can two designers really share a screen?

Friday, May 24, 2013

This post is pair-authored by David Friermor and Nina Mehta

Traditionally, pairing has benefited both pivots and clients improving productivity and quality of output. We want to see if design pairing is a way to move creative, collaborative work forward. We define design pairing as when two designers, work with two mice, two keywords, two displays but only working off one computer. We paired all this week and want to share our reflections with the community.

This week we did remote user testing, script writing, card sorting, sketching, wireframing prototyping and some visual design. Because we worked in a pair, we had more fruitful research findings and came to a better site architecture for our current project.

What’s awesome

We found that the quality of what we produced was higher and done faster than if we worked in silos and came together just for reviews or critiques. By working in pairs, we were able to share processes, skills and techniques to find the best answers of the design problems we were facing.

Pairing also allowed us to put our work through a rigorous process and have focused discussions as decisions were made. Real-time critique makes our work better and let us execute and build upon ideas as we were having them.

What’s hard

Design etiquette and pairing etiquette is already difficult; combining the two is no walk in the park. Letting go of control is hard. Letting go of your keyboard, your ideas, and your chance to say something is all hard. And especially when you don’t want to.

Design is traditionally an internal process; it’s difficult to discuss and explain every thought. We are trained to defend our ideas and refine a thought before sharing it. Getting into each others’ minds at first was uncomfortable and made us feel vulnerable. Once we got over the first hurdle teaching each other what we knew became fun and made our work better.

Well, now what?

We only paired for a week and feel like we’re stepping into somewhat uncharted territory. We recognize that design pairing is not feasible for every project, however we want to see what this can do for other product designers.

Do you have experience design pairng? Tell us about your experience.

Tracker Ecosystem: Member Tracker – View people’s workload

Ronan Dunlop

Friday, May 24, 2013

“I’ve been looking for a couple months for the right third-party tools, and
couldn’t find them, so I decided to make my own.” said Brian Noah from eGood. We love and admire that initiative in our users, especially when they build something this cool. The app he had to build is called Member Tracker!

Member Tracker ties Pivotal Tracker stories and members together allowing you to view what different members are working on and what they have worked on in past weeks and iterations.

There are multiple ways to access this app:
• go to the website: membertracker.herokuapp.com
• install the web app onto your iPad home screen from the website in Safari.
• install the chrome shortcut via the Chrome store for quick access.

Check it out – it just may be that other perspective on Tracker you’ve been looking for.

Bring your own Kitten GIF

Pivotal Labs

Friday, May 24, 2013

Interestings

Don't hardcode placehold/cat/charliesheen services into your code

Just your annual reminder that these services go down and will timeout your tests. Just download the kitten and serve it yourself, ya dummy.

Postgres sorting is not consistent when using offset and limit

It seems that postgres will sort consistently within a "page" of results. So the results on page 2 will always be the same.

But if there are duplicate values in your sort column and those duplicates cross a page boundary, it is entirely possible that one of those items will show up both pages.

So best to throw a secondary sort column in there if not sorting by a unique column.

A Lego in Times Square

Pivotal Labs

Friday, May 24, 2013

Interestings

Checkman + Tracker

You can now monitor Tracker projects in Checkman.

Update to the latest master, install the Pivotal Tracker gem and checkout the readme.

https://github.com/cppforlife/checkman/blob/master/README.md#included-check-scripts

Finding the middle for designers and developers

Nina Mehta

Wednesday, May 22, 2013

Oh the age-old ‘should designers code?’ debate again. Nope! I pushed the matter further last night at Pivotal’s Extreme Roundtable meetup in LA. I asked, ‘how involved should designers get into code?’ and ‘Should developers design?’ In a room of 7 developers, the latter surprisingly got the most votes.

It all comes down to finding the middle and meeting there. It’s challenging for developers when a designer is thinking too high level in abstractions or too low at implementation details. Having conversations at the wireframe level, the middle, lets both parties have fluid discussions about product and implementation. It also gives the opportunity to try something out before going too far down a path that has a dead end.

When designers get too far in the ahead, the product owner gets too committed and excited about an idea that’s still just an idea. If they devs aren’t involved early in the process, product owners are sometimes “so juiced” on the idea that they’re disappointed or frustrated when implementation is expensive or ends up not being a good direction. It’s important for the three teams: design, development and product to be exploring ideas and communicating throughout the process.

However, designers who know a lot about code and implementation can be a dangerous constraint. It’s important for designers to understand how code works, but not be a barrier in ideation and generation phases. Let us not forget blue-sky design. One developer said, “sometimes they come up with really expensive ideas that are hard to implement, but it’s worth it because the design and user experience ends up being excellent!”

It’s a toss-up about whether or not developers should design or make product decisions. In some regards, they leave that up to the designers, which can be frustrating if the designer is blocking and not able to make quick decisions during development time.

Developers do have a lot of experience with implementation and should speak up what they’ve built before. It is ok for them to talk about where a design path may lead, because it doesn’t always lead to fairy tale ending. Devs should feel comfortable telling designers, “I know your expectations for this layout [or interaction]. It doesn’t play out how you think it it will. It doesn’t usually go the way you want.” They should of course propose some alternatives or explain which part doesn’t work. It can be frustrating for a designer to hear that, but that’s why it’s so important to start conversations at the wireframe level.

The developers last night said they like the idea of designers coding–if their code is good enough. It’s more important designers understand how code works to inform discussions and decisions.

What do you think?

My Parade Costume’s a Kitty, What’s Yours?

Pivotal Labs

Tuesday, May 21, 2013

Interestings

Google's favicon service

A reliable way to get cached favicons (e.g. https://plus.google.com/_/favicon?domain=pivotallabs.com )

Showing and hiding conditional HTML without Javascript

Stephan Hagemann

Tuesday, May 21, 2013

Have you ever filled out an address form that had a checkbox for “my shipping address differs from my mailing address”? When you click that box a conditional form part gets revealed that allows you to enter another address. We had to build something very similar the other day and stumbled on a neat way to make the conditional part show and hide with CSS only.

Here is how:

<style>
  .conditional_form_part {
    display: none;
  }

  .conditional_form_part_activator:checked + .conditional_form_part {
    display: block;
  }
</style>

<form>
    Mailing address differs from home address
    <input class="conditional_form_part_activator" type="checkbox">

    <div class="conditional_form_part">
        some other content
    </div>
</form>

Here is a jsfiddle of the result:

As you can see from the CSS section, the trick is the combination of the :checked pseudo selector with the + selector. When elements like radio and checkbox are checked, the :checked selector applies. The + selector applies when an element immediately follows another element. In combination we can target the immediate sibling of a checked checkbox and use that for styling.

There are a couple of other CSS selectors that allow you to extend this example, e.g., the tilde operator, which selects any following element. Better brush up on your CSS selectors.

YMWBL – Your Mileage Will Be Limited

Note, that you would not be able to make this example work, if the checkbox were wrapped in a label (or any other element). There is no selector with which you could target the conditional form part in that case.

As far as structural queries go, CSS is limited in expressive power to only allow selection deeper into the document tree (i.e., with the > (child) selector) or downward within the current level (with + or ~), but never upwards within the tree.

Finding Pivotal

Matthew Parker

Monday, May 20, 2013

The year is 2005. I’m one year out of school, and a year into a job doing PHP web development at a small development firm in Dallas. A co-worker tells me jokingly about extreme programming. He laughs about the absurdity of pair programming and writing tests. Another developer goes rogue and develops an application in something called “Ruby on Rails.” He’s learning the framework at the same time he’s developing the application. I boast that I could have done it in half the time in PHP. That developer takes a job for a company in Seattle doing Ruby on Rails. I spend another frustating year at the company in Dallas.

Fast forward four years to 2009. I’m now living in Manhattan. Burned out on PHP, I’ve spent the last year doing free-lance Ruby on Rails development. I love it. It’s everything I wanted out of a language and framework. It solves all of the common, tedious problems that I faced developing in PHP, and lets me focus on developing my applications.

I land a job at a giant multi-national corporation. The team I’m working with is agile. They hold standups. They have a certified scrum master. They do two week iterations (on projects with fixed scope and hard deadlines). They estimate stories (in hours) (that they write themselves). They write tests (sometimes) (after they write their production code).

It was the best thing that had ever happened to me. And it was hard. And it was painful. We attempted to be agile within an organization of six-sigma blackbelts that would spend 18 months defining a process for defining processes. We didn’t know what we were doing half the time. We got a lot of stuff wrong. But we cared. And we learned. And we got better.

Fast forward three years. I’m still working for that giant company. I get an email from Pivotal Labs. A co-worker warns me, “You know they pair all the time.” I’m a little frightened. I go in for a day-long pairing interview. It’s amazing. I learn more in that one day than I had learned in the last year of work. I pair with developers smarter than me, better than me, and more experienced than me. I take the job.

Every day at Pivotal is like that first day, but even better. I learn something new every single day. I work with other engineers absolutely committed to developing great code. We give new meaning to the word “consultant”, giving our clients not just advice, but pairing with them to act on that advice (and course-correcting when things go wrong). We pair program. We test drive. We collaborate on story specification. We start each week looking at our priorities and estimating our stories. We end each week reflecting in a retrospective, talking about what’s working, what’s not, and what we should do about it. We take breaks throughout the day. We play ping-pong. We’re relentless about self-improvement, team-improvement, project-improvement, and company-improvement. And I’ve never been happier. I’ve never had the privilege of working with such a talented, passionate group of people.

We want to change the way the world develops software. You can too. Do the right thing. Do what works. Be kind.

Simple Test Parallelization

Hunter Gillane

Monday, May 20, 2013

Let’s look at a simple approach to parallelizing a test suite for a Ruby app. Parallelizing your specs can be a good strategy to get a speedup on an existing slow suite. It can also be employed early on a greenfield project as part of a commitment to fast tests. The same caveats that Andrew mentions in that article post here as well, namely that parallelization might mask more important design changes you need to make in you suite.

While you could use a gem like parallel_tests, let’s look at what it would take to achieve this without needing to pull in another dependency.

The only requirement to employ this approach is that the parts of your build that you want to parallelize do not share a database, or if they do, that it will not cause test pollution if your specs run at the same time. These parallelizable portions of your build could be Rails engines, a library in lib, an unbuilt gem, or any other isolated piece of your app. If your app doesn’t meet that requirement, something like parallel_tests will likely be more useful.

Let’s assume that you are using engines to organize functionality in your app. In this case you likely are already using a separate database for each engine’s test suite, so let’s use that as a basis for our example. Assuming that you have two engines (engine1 and engine2) and they are both in the engines directory, you could write a rake task that parallelizes your build that looks something like this:


task :build do
  build_pids = []

  %w{engine1 engine2}.each do |engine_name|
    build_pids << fork { exec "cd engines/#{engine_name} && rspec spec" }
  end

  trap(:INT) do
    build_pids.each do |pid|
      begin
        Process.kill(:INT, pid)
      rescue Errno::ESRCH
      end
    end
  end

  Process.waitall.each do |pid, status|
    unless status.success?
      puts "Build failed"
      exit 1
    end
  end

  puts "Build successful"
  exit 0
end

This rake task does three things:

Uses fork+exec to kick off child processes to run each engine’s build
Collects the child processes after they have completed and exits non-zero if any of the child build processes were unsuccessful
Captures INT so that all child build processes will be killed when you Ctrl-C in the terminal

The output can be ugly but may be worth the time savings, especially if you only are going to be running this task as a last check before CI.

Is there something funny about your Standup?

Graham Siener

Monday, May 20, 2013

Agilish

Software development teams that aim to be more “Agile” often pick and choose the pieces of an agile methodology that suit them. For some reason standup is usually picked first, way before addressing their waterfall ways. I guess it’s because it’s hard to do “retrospective” but easy to stand up during a meeting (despite teams that sit through their standup).

I’m a big fan of standups but have also witnessed ones that are poorly executed or even detrimental. A traditional standup is a five to fifteen minute meeting where each team member stands together and answers three fundamental questions:

What did I accomplish yesterday?
What will I do today?
What obstacles are impeding my progress (blockers)?

A standup is not:

A status report for your managers
The forum for discussing details at length
A replacement for healthy and timely communication with your product team
A way to trick developers into coming in early

Walking the Wall

The intent of standup is to share work in progress and highlight blockers — why not use the tool where you manage your agile development process? This is typically referred to as “Walking the Wall,” and in my opinion creates a quicker and healthier conversation. Here’s how:

Open Pivotal Tracker (or your agile tracker of choice) on a screen that’s easily viewed by the team. Standup stations work well for this, otherwise you can huddle around the monitor with the most space. Close the Icebox and zoom in on Current.

Step through each story in the Accept/Reject state. Is it clear how a story should be accepted? Is it clear [for larger teams] who is doing the acceptance for a story? Side note for story requesters — do your best to accept stories right away. Nothing is worse for a developer than seeing a rejection at noon for a story that was delivered yesterday.

Moving onto the first story in progress, let the story owner describe the work and give a gut check on how it’s progressing. This is a great opportunity to raise concerns about an estimate, e.g., “This was pointed as a 2 but we had to do a lot of refactoring of the css. We’ve probably got another day of refactoring before we deliver.” Context is important, and highlighting this discrepancy gives the PM a chance to course correct if need be.

Once you’ve covered WIP, move on to the next set of stories in the Backlog. If any have blockers like a “needs-discussion” label, drill into the detail and identify if you can resolve them on the spot. If something needs design/assets, hopefully your designer (along with the rest of the core Product team) is there to confirm that they’ll upload the right files, etc.

Lastly, work out your pairs for the day and cover any housekeeping (“we’ll be reticulating the spines at 3pm, no pushing commits”)

If some important topic comes up and can’t be resolved within fifteen minutes, schedule a follow-up meeting with the people needed to resolve the issue. You don’t get points for dragging out a standup until every problem has been solved!

This is the format for standup that I default to now. I encourage you to give it a try if you’re finding standups have lost their value, or if you don’t think product stakeholders are in sync with the development process. As always, ask your doctor if continuous improvement is right for your team.