DesignDrivenNYC: growing the design group and design function in organizations
Posted on May 11th, 2016
05/10/2016 @WeWork, 115 West 18th Street, 2nd floor, NY
Three speakers spoke about their methods to integrate #design processes into all parts of product #development within retail-facing #financial firms. Betterment is a small, but rapidly growing company that is upsizing the design team. Citi and Learnvest are moving from a haphazard view of design to a single customer-centric design process throughout the organization:
- Billy Seabrook, Global Head of Design at Citi
- Abigail Gray, VP of Design at LearnVest
- Jaime Strollo, Lead Product Designer at Betterment
In the first presentation, Jamie Strollo @Betterment spoke about the challenges the UI/UX design team faces as the company goes from a small startup to 9 designers to doubling by year end. Originally Betterment had a flat organization, but now there are challenges: integration of new people and avoiding the bad dynamics of large meetings. Design is the only shared resource across the company, so there was duplication in work. Some strategies for tackling a new design challenge are:
- Kick off strong – ask what is the problem?, what is success?, how do we measure?, constraints? Initially concentrate on measuring the drop-off rate when evaluating a design change. But eventually shift to measuring the effect on profitability.
- Assumption gathering – for stakeholders, high-level activity, focus on fears and confidence, agree of riskiest assumptions, talk to customers to validate.
- Focus on Top 5’s
- Great for large groups, Iterations
- High-level activity
- Select only top 5 design needs
- Helps to Establish patterns
- Bridge the “delete” conversation
- Ideation / paper prototyping – better for smaller groups. Bring in other areas of expertise, let others have a voice
- Managing feedback – decide who are the decision makers, who to inform. No big UI critiques (a polished presentation gives a finished feeling and makes it hard to change), share often and early, speak about objectives and key results. Start conversation by what is the objective.
- Invest in relationships – customers and coworkers
Another challenge as the company grows is creating a method to give better estimates of the time to complete a design. This is hard since much of time goes into understanding the problem
In the second presentation, Billy Seabrook @Citi spoke about how Citi has created a single world-wide design team. The goal of better design is to move customer’s view of the bank from a transactional experience to a relational experience.
Starting six months ago, Billy has approached the following challenges within the bank:
- Organization – create agile groups adding individuals looking at strategies; research and usability studies; producers to keep on time and budget.
- Skills – Create a cohort of coaches to teach design thinking throughout the bank. Minimal viable product is at the intersection of business viability + customer desirability + technical feasibility; Partner with IDO to foster agile design thinking throughout all parts of the bank
- Applied Projects – Citi Fintech launched 6 months ago to launch the bank of the future: focus on mobile (mobile only), speed and simplicity (2 weeks of design thinking + 2 week dev sprints)
To foster common branding and look-and-feel world-wide, document templates are shared world-wide. Senior people in each location are in constant contact.
Coaches have backgrounds of policy or planning. The main thing is the mind set of being customer centric. In the past, most of the product design was outsourced, so design principals were inconsistent also there was a lack of consistency in evaluating designs.
The Design group reports to the COO of Fintech and is considered a cost center (despite its’ close affiliation with profit centers).
In the final presentation, Abigail Hart Gray @Learnvest (help financial planners create simple, effective, .., plans for retirement…) talked about the challenges of integrating a unified design process into product development at Northwestern Mutual (acquired Learnvest last year).
Abigail started with the question of a Defining Design Driven? She interviewed experienced design professionals and found commonalities:
- Team structure – be at the table when decision are made
- Process – iterative process
- Outcomes – but interviewees disagreed up whether good design resulted in products that were best for customer or best for business.
She talked about becoming a champion of design within the company:
- know the capabilities
- need to invest in design
- designers must educate their audience and sell their vision.
If you need to explain the interface, it stinks!
Steps to get started (data-driven, customer centric, outputs oriented):
- pick something with low stakes – no bottom line implications
- research well
- measure everything
- share results
As an aside on the measurement process, one needs to consider the possibility that customer behavior changes by knowing that they are being observed. The Hawthorne effect can elevate or suppress responses depending on prior customer engagement (friends&family vs. the general population), frequency of engagement (daily vs. occasional), etc.
The Rise of the #DataArtist
Posted on March 9th, 2016
03/09/2016 @ PivotalLabs, 625 6th ave, NY
Olivier Meyer & Ryan Haber@Zoomdata talked about the advantages of interactive #DataAnalysis. They showed how a single picture can show the ruin of an army through cold and casualties. This was done by Charles Minard in his graphic of Napoleon’s 1812 invasion of Russia. There, 6 time series are displayed to great effect.
Next, they talked about the complexity of displaying facts buried in large data sets. This complexity creates a new category: Data artist who sits between the business analyst and the data scientist
They demonstrated how their program facilitates the interactive search for patterns in the data by retrieving only the relevant subset when needed for the graphics display. They call this microservices & data sharpening (initially a rough picture is presented, but results are refined as you watch).
Many interesting points were brought up in the discussion.
- Before diving into the data, one needs hypotheses of what is relevant to decision making
- Care must be taken, since interactive graphics (as in all graphics – see Darrell Huff “How to Lie with Statistics”) can inspire misleading or unfounded conclusions
- The data artist is obligated to present graphics that are truthful
- Generic templates may not be the best data presentation
- One needs to balance the customization of the data presentation with the time & effort expended to create an improved graphic
- Graphically inspired conclusions need to be supported by relevant statistics
- Frequently, statistics (alone) are not the best way to present findings
- The best way to communicate is dependent on the audience.
- The tools for data exploration may or may not be different from those for presenting conclusions.
Mobile Display of #NewJerseyTransit #Bus and #Train Updates
Posted on January 14th, 2016
01/14/2016 @ 50 Harrison St, Hoboken, NJ
Bob James @ NJTransit spoke about their acquisition and dissemination of real-time train and bus data. This is exemplified by the current bus locations shown on 126.96.36.199.
Bob talked about 12 years of automating the collection and reporting of real-time data. The initial goal was to automate arrival and departure announcements at train stations. Doing this required locations of trains and buses in real time. This eventually led to DepartureVision and other in-station and mobile displays of arrival times. (Locations with LED signs will eventually have countdowns included in the display.) Systems are also being upgraded from recordings (female voice) to text-to-speech systems (currently a male voice) by Loquendo. In most cases, the triggering of announcements is fully automated.
Ticket sales were the first items in the mobile app. This was followed by trip planning, station information, etc.
Buses. Currently all 4,000 buses are tracked by GPS. The MyBus app shows bus locations in real time. A system was also developed to record when buses leave, number of passengers, departure gate, … This is populated by a central database and updated using mobile apps. Within NJT, eStarter, a mobile app reporting arrivals and departures at Port Authority, is used by dispatchers to reschedule and redirect buses to keep them on time. The system replaces manually created monthly performance reports. It also has proven useful during storms when counts of morning commuters are used to estimate the evening demand. Clever Device automates the counting of people boarding and exiting each bus.
Trains. The position of each train is reported by track circuits since trains do not have GPS on board. 50 stations have wifi provided by CableVision. Spring 2016 will see the rollout of onboard wifi. Currently, most mobile access is through 3rd party apps which can combine data from other transit providers. Eventually he sees a move from the current feeder system to Uber. This will also make it easier for all riders to get to and from the train station.
Design Driven NYC: #TypeFace, an online space for #Designers, #Design for non-designers and designers
Posted on December 9th, 2015
12/8/2015 @ TheNewSchool, 66 West 12th Street, NY
Four speakers talked about design related concepts:
- Anil Dash (@anildash), Founder and CEO of Makerbase
- Sara Chipps (@SaraJChipps), Founder and CEO of Jewelbots
- Josh Long, Product Design Lead at Oscar
- Gail Anderson, award-winning designer, writer, and educator with a career spanning Rolling Stone, Broadway and beyond
In the first presentation, Gale Anderson @SchoolOfVisualArts shared her knowledge and enthusiasm for different type sets. Gale talked about various design projects from her largest, a sign on the campus of the Pennsylvania College of Art and Design in Lancaster, PA to her smallest, a U.S. stamp commemorating the emancipation proclamation.
She as co-authored with Steve Heller 12 books typefaces and wrote the book “Outside the Box” on hand drawn type on packages.
Gale also talked about how her passion for type extends to a collection of bottle caps and pictures of outdoor signs in NYC.
Gale spoke about the many authors who have inspired her and given her insight. These include
Some of her favorite contemporary designers include
She recommended as a reference book – Ellen Lupton “thinking with type”
The second speaker talked about a site for posting your accomplishments in the world of design. Anil Dash @Makerbase has created a site where designers can memorialize their work and seek like minded people.
Anil talked about the difficulty in getting credit for your accomplishments and how the makerbase.co site strives to make the site a good environment. He talked about discouraging “drive-by contributors” with the following rules
- Persistent identities – so you can see the history of what you have done. Don’t require real names, but you cannot be anonymous
- Adding accountability around content
- Whenever you change things – the editing actions are visible in context.
- Show your actions to your peers – receive email notification.
- Trust people to use their judgment.
- You can edit your own page.
- All your actions are viewable in your profile.
- There is a moderator for content who will get an alert if there is an “edit battle” (if a page is being modified frequently by two individuals) or other disturbances
- Make it easy to flag anything, anywhere
- Make a place people can trust
- Anything you put on the site is public.
He said the biggest challenge is to get people to come back and also for people evaluate what other people are doing.
He wants to make the site a place to share information on how to solve problems.
Next, Sara J Chipps @Jewelbots talked about how she, as a non-designer, manages designers.
Sara loves good design and spoke of how important design is in the products (Amazon Echo, Glossier , Bustle, Caeden (headphones)) she uses and the games (monument valley) she plays. However, she is not a designer. She gave recommendations on how to acquire good design if you are not a designer and how to communicate with designers.
Sara’s Principles (for those who are not good at design):
- Copy those who know how to design – Googled “beautiful slide deck”: Solid color background, sans serif, mostly in caps, etc.
- Illustrator and photoshop are difficult. Like pixelmator since it is easier to use.
When dealing with designers in your business
- Hire for perfection – and passion for the craft
- Never be prescriptive – better to share what your emotional response when you view the page.
Finally, Josh Long @Oscar (health coverage) talked about how design fits into a rapidly growing company that needs to design for many groups: patients, doctors, etc.
He talked about ways to make design work
- Don’t wait for things to happen – come up with your own objectives.
- Everyone has the right to come up with ideas, so respect what other are creating
- Experts need to make the big decisions – it’s a balancing act
- Don’t be precious about anything – your first idea might not be the best
Embrace the chaos.
When asked about the type face for the whimsical ads on the subway, Josh said that they wanted to balance the playful nature of the graphics with serifs on the type face to emphasize the serious nature of the product.
CodeDrivenNYC: caching web pages, #NLP, bringing #coding to the masses
Posted on November 20th, 2015
11/19/2015 @FirstMark, 100 Fifth Ave, NY
The first of the three presenters, David Mauro @Buzzfeed spoke about creating Mattress, their first open source IoS framework. Mattress caches web pages for later, off-line consumption. It also makes it appear that the page is loading quicker when online.
David spoke about the hurdles implementing this product
- How do we download an entire web page?
- How do we provide the content back to user
Their first decision was to download the URL using UIWebView and then capture all requests as they come through using NSURLProtocol. UIWebView runs on main thread and is resource intensive, but the alternative to manually parse the HTML and the JS. They download the URL using UIWebView and then capture all requests as they come through using NSURLProtocol. But WKWebView does not handle NSUIRLProtocol and there is a bug so you cannot just save another NSURLCache. They use commonCrypto to retain the URL, with the name hashed so even the longest name is uniquely identified.
They also need to know when a page if done downloaded. Automated solutions have tendencies to either terminate prematurely or not terminate at all. Instead, they ask the user when the download is done.
How to provide the content back to NSURLProtocol? First ask the user if they are offline. If so, they retrieve the page from the custom offline cache. If they are online, the system reloads the initial request.
The system was designed as a simple API that can be run either in foreground or in background fetch. The background fetch needs to be monitored carefully so it does not use too much of the battery or slow the processing excessively.
The second speaker, Rob Spectre @Twilio demonstrated how easily applications can be made interactive using the Natural Language Processing tool, Textblob running in python.
Rob showed how to create an app that receives SMS text messages and changes its response based on your message. In just a few lines of code, Rob showed how the response can be differentiated based on the length of the message, it’s sentiment, it’s sentence structure, etc.
Ryan Bubinski @Codecademy asked the question “What is code?”
As an overview of the many ways to answer that question he recommended the 38,000 word article written by Paul Ford in Bloomberg June 2015
He summarized his view by saying that code is a lever that is becoming more powerful every day. As an example, he mentioned OpenFace, an open source program which uses a neural net for face recognition.
Making this lever available to more people requires either
- Making coding easier or
- Making it easier to learn how to code
What you get from unmoderated and moderated #testing of #prototypes
Posted on October 22nd, 2015
10/22/2015 @Ishi Systems, 185 Hudson St, Plaza 5, STE 1400, Jersey City , NJ
Steven Cohen @Validately spoke about the goals and advantages of prototype testing.
He started by reviewing his history in startups: one successful start and one failure. After these experiences he asked why does innovation fail?
- False positives – estimated that 50% of a typical product’s features are not used (see http://versionone.com)
He then asked what you can learn from users
- UI usability – can user complete a task by clicking on the appropriate links? – the inventor is too close to the product to know this
- Real life usability – get a lot of false positives here. “It’s not a big enough problem.”
- Are there blockers – usable in real life, such as privacy/security issues.
- Better alternatives – something I’m using now. What is it like?
- Does it solve a need? Needs to be big to change inertia. Need to get to “no” to show you know the issues. For instance introduce a price and ask if they would buy it (time, reputation, money)
Steven then presented two ways to test prototypes
- Unmoderated – asynchronous testing as the user explores the functionality – good for UI usability
- Less work, subjects pace themselves and give verbal/written feedback
- Can’t learn real life issues
- Moderated – live test interacting with the user and asking for opinions – better for real life usability
- Deep user learning – usability
- More time commitment
Steven did a simulated interview to show how the moderator would probe the user his/her actual usage of the product. One of the most important aspects is to get the user to make decisions on feature tradeoffs. The main tradeoff is whether a feature is work a specific amount of money and if not, why not and would there be a lower price point.
He wants to put up road blocks and see how people react – e.g. put up a page and ask for a credit card (even if you don’t keep the number) – see how much commitment. This is an attempt to get the feedback that users might not way to give you since they do not want to hurt your feelings or be confrontational.
Other observations were
- If you need to pay your own existing customers to participate in a test, then the problem is not that important. Power users will probably always test for free.
- Validately will start video recording the user, but does not believe eye tracking adds much since mouse movements correlate highly with eye movements
- For unmoderated tests, if 5 of 6 users can do it. it’s probably adequate
- For moderated test, start with 6 to 10 people. If there is a consensus, you can get by with fewer. If there is no consensus, then your persona (a straw man demo) is probably not well defined.
- Once you have made a change, go back to the initial set of users and see if it fixes the problem – did we understand the comments?
The bottom line is, don’t build stuff that users don’t need
Design Driven NYC: #redesign, #usability, #consultancy, #rebranding
Posted on October 22nd, 2015
10/20/2015 @TheNewSchool, 66 West 12th Street, New York, NY
Four speakers talked about the important of #UX design in product development:
- Talia Fisher and Ben Gelinas, Lead UX Designer and Creative Director at JackThreads (formerly part of Thrillist Media Group)
- Scott Stein and Eamonn Bourke, VP of Product and Design Director at USA Today
- Rohun Gholkar, VP of Product at NewsCred
- Jules Ehrhardt, Head of NY Studio at ustwo, a digital product studio behind products like the smash hit Monument Valley
In the first presentation, Scott Stein & Eamonn Bourke talked about the redesign of the #USAToday web site and mobile apps. Three years ago USA Today redesigned their pages while keeping their focus on the news with increased use of user-generated content.
They wanted to retain design components they thought were successful such as the headline stack on upper right and have similar functionality to what already existed in 2012. They also felt that native apps were the best way to deliver different types of content for each platform. The responsive design would concentrate on the home page. Despite this, they wanted to create a common look across platforms. One example is a live logo in the upper left which is changed daily to summarize the big topic for the day. The design was also done with a goal of making a common look for all Gannett publications, both large and small.
The first page has a newspaper layout. Following pages have visual breakouts so users are reminded where they are in the app/site. Tablet apps snap from page to page while phone apps scroll. They wanted to naturally include in-line galleries and in-line video. Social media is imbedded within articles. The navigation conventions were adjusted to be consistent with the device, so Android users see the usual Android navigation conventions, while Ios users have Ios navigation tools.
Their usability tests have guided their design
- Users scan headlines with images being of secondary import
- Users graze off the front page. They don’t swipe from story to story
- Instead they go back to the front page to go to the next story
- Users want a sense of hierarchy indicating the top stories
- Despite the ability to create immersive, full-canvas ads, most advertisers found it more cost effective to say with more traditional ad placements.
- Mobile users often prefer text to videos
In the second presentation, Rohan Golkar, Jake Lazaroff , and Jan Cantor talked about the consulting projects at NewsCred to increase customer interactions.
They call their concept “Customer centricity” = what customers value most + what drives the most value for businesses. The approach involves
- Prioritize customer challenges, not features of the site: know what problem you are trying to solve. To do this give teams challenges and let them take ownership of scoping and validating a plan. Try to make things fit together. Set up Key Performance Indicators.
- Listen and observe your customers. Observations are especially important since users don’t always say what they really want. Conversation –> Observation –> Inspection. They talked about a calendar app in which they initially moved information from the display into a hovering tool tip. Despite the improvement in the look and feel of the app, they found that users were losing this information when they took screen shots to send to others who did not use the app. As a result information was lost in transmission. To remedy this, they added an export function. They also take engineers and designers to their training sessions so the engineers and designers develop empathy toward users.
- The minimum viable product should not be just your first release. It should be every release. Scope small, fail fast and iterate early and often. Shipping frequently feels great and makes customers happy. Requires a fast feedback loop.
- Measure and make measurement part of your DNA. Focus on metrics.
- Customer centricity is a team sport – trust and transparency are keys to success. In-app presentations should announce when new features are introduced.
Jules Ernhardt @ustwo then gave his view on the present and future of design.
Besides creating #MonumentValley game, ustwo has worked on a variety of projects including watch faces for Google and VR guidelines for Google cardboard developers.
Currently, Jules sees independent design studios acquired by larger firms which consider design an important part of product differentiation. He, however, sees challenges on maintaining the integrity of design within these larger shops. Eventually he sees a return to consultancy.
His larger picture of ustwo and other design firms is to develop the capabilities to develop products as well as pure design work. This requires multiple disciplines: engineering, branding, etc. One way to do this is to become a digital product studios working in the areas of
- Venture work
- Own IP
When asked about the maximum size of such a studio Jules said that, 100 to 120 people would be a good size. (This is similar to the size anthropologists find in tribal groups as space and time limits our abilities to create strong social bonds to everyone in a larger group.) But studios can replicate the model in different cities. The balance is to generate enough money and profit to risk venture work.
In the last presentation, Talia Fisher and Ben Gelinas @JackThreads talked about the rebranding of the site. This involved moving away from a purely data-driven design to develop a brand using data-driven methods.
The move was initiated in response to the following changes
- The flash retail market was dying with fewer leftover things to sell
- New leadership
- Need to differentiate from other brands
The data driven design process included the following
- Daily and hourly goals
- Data -> insights -> design
- Myopia as a result of some findings: e.g. A/B tests indicates that heads of all models should not be shown when modeling product. The site looks crowded with an infinite scroll of objects at the bottom.
Efficiency can mean the inability to create a brand (in the extreme, all firms come to the same conclusions and all sites look identical)
- Too much and no visual hierarchy.
- Too tall so logo takes too much space
- Not distinct enough
As a result of the changing business environment, they decided to launch their own clothing line. This requires branding and requires them to cut down on the items they carry and create a better user experience.
They wanted a sense of quality that encourages discovery of a personal style. So they first concentrated on global navigation redesign to improve usability. They worked on the big pictures. So the redesign might affect conversion rates and bring down revenue per session, but branding in this case took precedence over metrics.
- The Home page redesign – less content, but more impactful.
- Move to highlight just one thing. Targeted shoppers could navigate to where they want to go.
- Use elastic scroll so users get from one page to the next with a short scroll.
- Data > insights > brand lens > design
Need to balance data with their design to create a brand
Cannot test brand loyalty with A/B testing in two weeks.
The #UX of Events Data: helping event organizers understand their audience
Posted on October 14th, 2015
10/14/2015 @Pivotal Labs, 625 6th Ave, NY
Chett Rubenstein @InsightXM spoke about InsightXM’s work on understanding attendance and registration of events such as trade shows, conferences, and festivals.
Chett described how insightXM can analyze the data which organizers already collect to help them achieve their goals such as increasing attendance, reaching a target market, etc.
He then talked about how insightXM improved their process to help the clients solve their problems. They proceeded in three iterations:
- First iteration – build a platform to upload data with some basic analytics
- Second iteration – build tools to help clients visualize files with large numbers of fields. Build mouse-overs so you can see the contents of the data fields. One of their interactive graphs shows the cumulative registrations over time, a map of the geographic distribution of registrations, and a slider and filters to slice the data by time and customer characteristics.
- Third iteration – make the data upload and categorization easy. The deliverables are bullet points summarizing any graphics presented to the client. InsightXM does the analysis behind the scenes.
Chett talked about current and future directions of insightXM and marketing in general.
- Increased used of behavioral analytics to better know the customer
- Linguistic analysis of marketing materials
- Real time demographic and behavioral prediction of customer preferences. For example, once a badge is scanned at a booth, you will know the individual’s behavioral preferences.
- Demographic lead scoring within CRM systems
- Referral engines at conferences suggesting sessions to attend based on individual preferences and behavior patterns of other attendees
Is #NUI the next breakthrough in #UI #Biometrics / #Personalization / #Identification?
Posted on September 21st, 2015
09/21/2015 @WeWork, 69 Charlton St., NY
Alexey Khitrov @SpeechPro spoke about his company’s #VoiceRecognition product. The product recognizes a user by his/her voice or voice + facial image. The voice + face system is used by Wells Fargo as one option to log into their mobile app. The system asks you to place your image within the view of your cell camera and then asks you to read aloud four numbers displayed on the screen. The system verifies both image and voice. The procedure replaces logins needing passwords.
The processing is split between the phone and server, but will eventually reside on the phone alone. The system examines the image for “liveliness” and matches lip movements with the number spoken. Both use a variety of technologies to arrive at a verification score that can be passed to the server.
The Amazon Echo does not have a camera and login requires voice input. For this, SpeechPro has developed a system which monitors continuous speech patterns and gives an evaluation for the conversation as a whole and the conversation over the last 5 seconds. In this way, the system continually verifies that the speaker is a valid user and if there is a change in speakers during the conversation.
Lastly, Alexey talked about a further layer of security they are implementing. Instead of displaying the four digit code that the user reads aloud, the digits will be hidden in a 5 x 5 matrix of numbers. Only the user will know the cells within the matrix containing the digits requested.
In summary, this is a product that could make it much easier to access your accounts on the internet as well as increasing account security. As this methodology becomes more popular, the security of the technology will be tested by new methods of attack.
Beaker Notebook: the #UX of Iterative Data Exploration
Posted on August 12th, 2015
08/12/2015 @ Pivotal Labs, 625 6th Ave, NY
Beaker was developed by Two Sigma, an investment manager, to give their researcher a tool to analyze markets and document their findings. It is now an open source product.
The notebook is divided into sections and sections can be grouped hierarchically into larger sections. Within a section, an analysis can be performed in Python, for instance, and the output is saved to Beaker variables. These variables can be analyzed using R, Python or any of the supported languages. Beaker can also produce interactive graphics using its own native charting package. The notebook with code, data, and graphs can be saved for further analysis.
Jeff and Scott next talked about the design challenges when creating Beaker. These include:
- All languages are fully supported.
- Open source
- Environment independent
To create an expandable library of supported languages they have an intermediate Beaker language with plug-ins to handle each programming language. To insure Beaker can run on different operating systems, on- and off-the cloud, the user interface is text-based with little formatting.
To accommodate the wide range of programming and data analysis experience across users, they developed several interfaces from verbose (shows language employed, etc.) to terse. To help all levels of users, they adapted the web interface to provide key features available on local desktops, but frequently not available in browsers: 1. Menus in the upper margins, 2. Windows that can be repositioned on the desktop, 3. File dialogs.
To give the web app these functions, they used a framework from ‘The Electron’ which is developed in Chromium incorporating the tools from Node.js.
Data and data structures are passed across languages using #JSON. This offers generality, but with some loss of accuracy for floating point numbers. (in the future they plan to pass values using binary files). They are currently working on methods to share notebook sections (and possibly forked versions).
The audience was invited to try out the system at BeakerNotebook.com.