As part of our Interaction Design and Social Entrepreneurship program, students immerse themselves in a wicked problem for a 24-week capstone project. This year, students partnered with the City of Austin Innovation Office to tackle civic engagement. For eight weeks, our students conducted design research by attending city council meetings, community events, and shadowing residents, city stakeholders and service providers. On December 16, students hosted a Design Research presentation to present these initial research findings to the community.
Watch the full presentation (or find the slides here):
Austin is a hub of creativity — it is a place where people come for opportunity to make businesses, art, music, and create friendships. Austin’s nurturing culture and specialness has attracted huge growth. Over the last five years, Austin has grown five times the national average. With this expansion comes growing pains that threaten what makes Austin so special.
What is Civic Engagement?
Civic engagement goes far beyond politics and voting. Civic engagement is promoting the quality of life in a community, through both political and nonpolitical processes.
One of the biggest problems in Austin is social equity. How can leadership come from all citizens? How can a diversity of voices be heard no matter how much education, power, or money they have? How can we improve equitable civic engagement in Austin?
Focus on East Austin
For this project, students narrowed their focus to civic engagement among East Austin residents. East Austin is culturally rich but full of low-income, disenfranchised communities that are greatly affected as Austin continues to grow. Students interviewed 52 individuals — 40 residents and 12 subject matter experts in government, urban planning, and public policy.
Within the East Austin community, students identified three groups to follow: low-income individuals, young populations that are not enrolled in traditional universities, and long-time homeowners. Through these interviews, they identified gaps and opportunities for making Austin a more equitable city.
From this design research, students developed insights — provocative statements that will drive designs moving forward.
The structure and enablers of growth in austin threaten long-term residents who are core to its culture.
How might we encourage growth in a way that doesn’t threaten these long-term residents?
The perception that wealth determines influence discourages community and political action, and reinforces inequities.
How might we leverage the power of perception to increase meaningful civic participation?
People become discouraged from participation when they don’t see the outcome of their efforts.
How might we make participation easier and create a feedback loop so that people feel understood?
For young working adults, the old ways of connecting with city government are remote but nothing has arisen to replace them.
How might we create opportunities for young adults to contribute to civic life that are in tune with their evolving culture?
For the next two quarters, students will take these research insights and opportunity areas and move forward to develop products and services that address some of these problems. Stay tuned for Q4 presentations in April as students present their final designs.
Interested in getting involved with AC4D? Applications for our 1 year program in Interaction Design and Social Entrepreneurship are due January 15, 2018.
As we hit the ground running for 2018, the Austin Center for Design is proud to announce our partnership with Design Thinking 2018 taking place April 23-25 in Austin. Creativity is key to addressing ill-formed business threats and for giving structure to poorly defined market opportunities, yet many of us have started realizing the limitations that come with creative mindsets such as Design Thinking and Lean; after doing a lot of thinking and pivoting, we realize we still have to do a lot of doing. Design Thinking 2018 is full of hands-on learning workshops including Design Thinking University, site tours at IBM Studios Austin and USAA’s Chief Design Office, and keynote presentations led by innovative design thinkers from a wide variety of industries featuring our very own Jon Kolko, Partner at the Modernist Studio and the Founder of AC4D.Our alumna Maryanne Lee, currently design strategy manager at LegalZoom will also be making an appearance as one of the speakers. Other featured design thinkers include: – Eric Quint, Chief Design Officer, 3M – Joni Saylor, Design Principal , IBM Design Practice – Joel Kashuba, VP of Innovation, Fifth Third Bank – Xavi Cortadellas, Head of Innovation, Gatorade – Shawn Johnson, VP Experience Design & Innovation, NBC Universal Take a look at the full speaker faculty or feel free to view the agenda.
If you are interested in attending, save 20% off current registration by using our partner discount code: 2018DESIGN_AC4D or email firstname.lastname@example.org for more information.
Excited to announce AC4D student Adam Chasen has been accepted as a finalist for IxDA’s Student Design Challenge! Chasen will join eight other top design students from around the world at Interaction 18 in Lyon, France. This year, the Student Design Challenge is inspired by 17 Sustainable Development Goals with a specific focus on Quality Education. Chasen will be assigned a team and work with them during a 72-hour workshop to tackle problems related to quality education; they will then present their work in front of 1000 future colleagues. Prior to AC4D, Chasen was an educator for over 15 years, teaching people around the world from kindergarten through graduate school.
Prior to AC4D, I spent a lot of time working with students of all ages, from pre-school through high school. My most recent role was at Eanes Elementary School in Austin where I taught 3rd Graders. I taught all subjects, but was lucky enough to have a supportive administration that trusted me to create my own projects for my students. It was in these projects that I saw my students come alive. We took on big, messy projects that allowed them to “figure it out” for themselves, and they simply oozed with enthusiasm, often wanting to skip recess to work.
When I asked myself the question, what’s a problem worth solving? I couldn’t let go of that special joy I feel when teaching. And I can’t let go of my fear that the school system is spoiling a young person’s chance for a bright future.
What I mean by this is, students are wildly unprepared to do just about anything upon graduation from high school and even college. But the problem is, we no longer know what we are preparing our students for. The future is unknown. The young people of today will be asked to solve problems in the future that we have yet to fathom. So how could a teacher possibly prepare her students for the unknown?
It’s clear that we no longer need to create students that can perform well on tests, and memorize facts. Really, we don’t even need to focus on preparing students for college.
We need to prepare students to be the thinkers our future will demand. We need to give them the skills and confidence to take on unknown challenges. And we must give them the courage to solve problems not only creatively, but earnestly and with reverence for the complexities of our world.
I propose a program for design thinking that gives students the opportunity to explore human centered design principles as it applies to complex problems. The problems will be both real and imagined, and students will learn skills such as sketching, ideation, prototyping, testing, and iterating. That’s right, it’s AC4D for young learners.
What I Learned
There are many schools in Austin that have taken on initiatives to incorporate social emotional learning (SEL), STEM, and design thinking. The importance of these skills is gaining traction, but teachers are so strapped with meeting state requirements, that doing a deep dive into the world of Design + Empathy is close to impossible. We need another way.
Schools could adopt the Design + Empathy program as part of their curriculum. It could be an after school program. Or it could a summer camp. After considering restrictions and running the numbers, I’ve decided that they best way to test a program like this is through a summer camp model offering a 1 week day camp.
The working name for this camp is Design Jrs.
The age range the program will focus on is 9-13 year olds. This is the age in which students have enough cognitive ability to think outside of their own selves, work independently as well as on teams, and whose parents still need to find activities and camps for them during the summer break.
Most summer day camps in the Austin are a week long and range from $250-$350 a week. By running a quick calculation of costs, revenue model looks sustainable.
I’ve also learned that my customers for this model are not just the students, but that the parents are my key customer.
Moving forward there are many parts of this plan that need to be validated. Will parents pay for this program? Will they understand it’s value? Will students be excited to sign up?
The first step in testing this plan is to conduct customer interviews with parents to understand how they go about finding and selecting a summer camp for their child.
I’ve been around parents and students enough in the past to have a vague idea, that I believe looks something like this:
If this decision making process is true, I’ll need to dive in more to developing a plan for helping Design Jrs. become a no-brainer camp decision.
Additionally, I plan to validate the enthusiasm of students. To do this, I’ll run short sessions in the classrooms of some of my past co-workers. The development of the curriculum will be an on-going process, but at this stage I’ll start by testing the concept and get feedback from students on the parts that excite and resonate most.
Other important steps forward include securing the location to host the camps out of. For this I plan to do some research and have conversations with schools that are already equipped with the types of space requirements this program will need.
Areas for Support
Have you yourself taught design thinking workshops or lessons? I would love to hear your approach and learn what resources or methods you found most valuable. Do you have ideas of possible locations? Do you know of similar programs in Austin I should be aware of? Do you know of any design organizations that would be interested in a partnership or contributing to this venture?
Internally, we’ve also seen a lot of growth. In June of this year, Jon Kolko passed the torch of Directorship to AC4D alumna and faculty, Ruby Ku. Jon remains an active advisor and faculty member, as Ruby embarks on a new chapter.
On November 27, AC4D alum Eric Boggs and Jonathan Lewis led a workshop at Federal Reserve Board of Governors’ Community Leaders Forum (CLF). CLF is an annual two-day forum that brings together 35-40 emerging leaders from the federal government, state government, credit unions, banks, and nonprofits, who all focus in some capacity on credit needs for low-income communities. Austin Center for Design was invited to create a half-day workshop for CLF to introduce participants to creative problem solving strategies that emphasize divergent thinking, empathy building, and visual communication, in order to drive future product, service, or system innovation.
Eric Boggs and Jonathan Lewis designed and led the three and a half hour workshop which included both presentations and break-out activities. After introducing design thinking, divergent thinking and empathy as concepts, Boggs and Lewis led three hands-on activities:
Affinity Diagramming: Participants wrote down what questions and problems they are focused on in their own work, and created affinity diagrams to find common group with other participants of diverse backgrounds and jobs. This led to small group discussions, facilitated connections, and ultimately provided organization for subsequent activities.
Participatory Design Canvas: To prompt stories and emotions, participants created a participatory design canvas. This served as a tactical example on how to build empathy with a participant and highlighted the importance of recognition over recall through the use of word and image stimulus.
Journey Mapping: To start breaking down stories and problems visually, over time, and in sequence, participants created journey maps to shed light on opportunity moments for a designed intervention.
“Overall the audience was very engaged and receptive to what we covered,” said Boggs. “Presenting these topics and methods in such short order sparked conversation around models for workshops or longer term engagements with designers in communities in order to foster change as opposed to a “fly in, fly out” type of workshop or engagement.”
If your organization is interested in a custom training session facilitated by our team, please get in touch with our Director at email@example.com.
For the quarter’s final iteration of my wireframes, I got to be a bit more creative with content. I focused on developing a budgeting toolkit to help users understand their current spending and shape their financial future.
The structured flows of the past weeks (deposit a check, transfer money between accounts, etc.) were straightforward in the sense that they require little idea innovation. So, with those flows, I focused both on how users access the tools and on details like selecting and placing buttons, establishing visual hierarchy, and navigating forms. Feeling I had a foundational grasp of these elements after the first four iterations, I approached this new set of capabilities with confidence. What I quickly learned is that I had an entirely new set of challenges to tackle:
New Toolkit Challenges
Seamlessly introduce unanticipated elements into an existing information architecture
Communicate complex calculations simply
Make it fun, easy, and approachable so people will want to spend time in their banking application
Make it fast and effective to get people in an out of the app. No matter how fun I may design it, people don’t really want to spend their free time in their bank application (thanks for the reality check, Jon).
Activities to Build Understanding
Given the level of thought that this project requires around information structure, I refined my concept map once more with my new elements reflected. Unfortunately, I completed this activity after creating most of my new features, and I ran into a content structure problem with my more robust Safe to Spend project.
I quickly learned that finance tools incorporate elements from all across the application. For example, my flex spending (Safe to Spend, below) category turned into a hodge-podge of credit card payment settings, savings contributions, and recurring payment editing. It essentially became an application within another application, which clashes with Apple’s iOS Human Interface Guidelines and thoroughly confused my classmates during critique.
I largely missed how confusing this feature was ahead of class, because I performed usability testing with the feature in isolation. Without seeing the larger context that “Safe to Spend” worked into, the now glaringly obvious issues did not rise to the surface. Instead, I took away a few tactical pieces of feedback for the details.
This usability testing feedback informed the current version of Safe to Spend.
The additional features I developed include the Fortune machine, which projects your future based on your recurring payment solutions, anomalous transaction flagging, and an easy snapshot of one’s financial performance for the month. These next sections are more properly contained than the above “Safe to Spend,” although they have yet to be tested with users and refined.
Primary Takeaways and Next Steps
Usability test full features and navigation structures, not particular flows
Craft a successful information architecture before moving to creating screens
Simplifying finances is challenging, and there is a lot of room for growth within this opportunity
While the quarter is coming to a close, I plan to continue building out these financial modeling tools where I feel inspired. I am looking forward to building in a credit score section, which will tie back to some of my original (recent US immigrant) inspiration for this project, and will be a great complement to the modeling tools developed for this course. Before I get ahead of myself, though, I need to give that information architecture map another pass and challenge the structure to which I’ve grown attached.
No matter what, there is always space for another iteration.
I’ve been re-designing an existing personal banking mobile application for the past eight weeks. Despite a 20-year career in marketing, much of the coursework is new to me. My former roles with digital products ranged from product manager to relationship management of the agency partner, and to project sponsor where I had accountability for success serving as a link between the project, business departments/divisions, and leadership.
Stepping into the role of interaction designer has been challenging and informative. Before now, I was flying by the seat of my pants and relying on partners and team members to do much of the heavy lifting. I came to understand and learn a replicable process to bring digital products to life: systems mapping, drawing and sketching for quick feedback, improving fidelity over time with Adobe Xd, usability testing and customer insights to drive iteration, and critique from others to make it better.
The usability test methodology was eye-opening for me. Throughout my career, usability tests were not a priority. It reminds me of design research: many executives and businesses do not see the value or understand the process. So I heard statements like, “just have someone bang up against it,” and “isn’t it your job to know if this works or not?” And from respected agencies, I’ve heard that usability tests are not included in the project fee because it would either take too long or cost too much.
In our course, I learned to use the Think Aloud Protocol for the usability tests. The method evaluates the usability of an application by encouraging a person to think aloud as they use the product. By verbalizing their thought as they use the prototype, I was able to understand what a user feels as they go about a task. As a person completes a function during the test, I provided one instruction: please keep talking.
Similar to the fast-paced real-world of business, the client made an acquisition and that changed the scope of work. In this scenario, a bank acquired an analytics company and will integrate the new features into the app on an accelerated scheduled. Stop what you’re doing, and now do this! In addition to incorporating baseline functionality of the newly acquired features, I set out to make the designed mobile application look more real than before.
Below are the screens I developed specifically for the functionality. As I come to the end of the quarter, I’m reminded of the phrase crawl, walk, run. As of this moment, I’m not sure if I’m crawling or walking with interaction design… But there’s on thing I know is true. I am growing, learning, and stretching in new ways as a person with his eyes set on becoming a designer.
Congratulations! Your banking company just acquired a financial modeling company, and now it’s necessary to integrate their products’ capabilities into your banking company’s mobile app!
This is the message our instructor, Jon Kolko, presented to us last week. It was a surprise feature change, and it’s not uncommon in industry to hear such news. With that in mind, we changed course and started immediately on developing new features and building out those screens instead of iterating and polishing even more on the existing screens and features. See this past post to learn more about previous feature build-out for our hypothetical banking application.
The criteria for the feature build-out included the following:
Provide a snapshot of finances and their trends
Analyze transactions to see if they are historically anomalous in the context of user’s spending
Provide a drop-dead simple “what if” modeling system based on “playing with” recurring payment amounts to see how changes in monthly spending impact the user’s account.
Help figure out what amount of money is safe for a user to spend at any given time.
Designing the Features
To get started with this process, I started by brainstorming, reading about, and diagramming all the concepts, details, relationships, and scenarios I could think of related to these features.
What kinds of recurring payments might people have? What types of finances might people want to review in a snapshot? When would they review them? Will people analyze transactions to see if they’re historically anomalous? Probably not. So perhaps the system will analyze transactions and alert users about them. What types of patterns would be useful?
After mapping out many of the concepts and sketches of scenarios, I developed a more rich picture of the user and feature use using scenario writing. I created a character named Eric who used his app to derive value using these different features. Once the scenarios were complete, I mapped ideas for different screens to the various parts of the scenario when he might encounter them.
Information Architecture & User Interface Sketching
Next, I started sketching the information architecture map and also started sketching screens. Though some people may think this process should be strictly linear, doing one before the other, I find it rigid and creatively dampening to try to go in such a linear order. While creating the information architecture map, there are details I’ll miss that will come out while sketching screens, and visa versa.
I then updated the digital version of the information architecture map.
I’ve received feedback in the past that I need to improve how much the app looks and feels like an iOS app. With this in mind, I looked at iOS apps like the calendar, clock, settings screens in order to better emulate the iOS interaction paradigms. I also reviewed and took notes on Luke Wroblewski’s book, Web Form Design, to improve the layout of my screens. I integrated various tips on alignment of fields, padding, visual layout, and language in this set of screens.
After sketching screens in low-fidelity, I moved to Adobe XD and laid them out digitally.
Finally, I did usability testing using the think-aloud protocol. The think-aloud protocol is a useful method for detecting usability errors, and I describe the process in detail in this post.
The following are descriptions of how I integrated the features into the Wells Fargo app; what errors I uncovered in usability testing; and how I corrected some of them and plan to correct others in future iterations.
General Product Integration
Overall, though some of my peers used the financial modeling and analysis features to create suggestions for users to save more, I chose to leverage the financial modeling features to simply support users’ financial awareness and decision-making. I believe that users will more likely change their behavior if they are aware of their financial positions and behaviors more so than if an app suggests they change those behaviors in particular ways.
Also, some of my peers created new paradigms for thinking about finances or leveraged emerging trends in financial apps such as “Safe to Spend”, a feature built into the Simple app. I found these concepts confusing and believe that users are most likely to value and benefit from features if they are integrated into existing paradigms such as using budgets, cost scenarios, and alerts.
Snapshot of finances
To integrate a snapshot of finances, I created a simple graphical layout of common financial information. The interface makes it easy to switch between accounts for analysis by swiping the account cards above, and the months can also be compared through a bar chart. Though the greyscale makes it challenging to read the colors, the circle chart will use color to clearly indicate spending area proportionality. These colors map clearly to a scrollable list of budget categories on the right. For more information, the user can go into any budget category by clicking through.
During testing, I found that users were confused about the scrollability of the budgets, and I will put shadow on the bottom and top of the scroll bar to make it more resemble a picker wheel that one can spin.
Historically anomalous analysis
Instead of relying on users to go into transactions to analyze them, which I find unlikely to happen, I developed the system to analyze transactions and send push alerts to the user as they were helpful. In this case, the user has signed up for “Savings Alerts” and sees an alert on the lock-screen. He then opens the screen to find the Savings Alert notifying him about grocery spending. It does not suggest he change his behavior as much as make him aware of the ramifications of the behavior over time. I think this will better improve user behavior than suggestions.
During testing, I heard users say things like “What do I do this now?” In the future, I will build-in opportunities to provide the system with feedback, allowing the user to respond to the notification and therefore “do” something with the information. Telling the system, for example, that the information was useful or not is one example. Another example is telling the system to remind them next time there’s a similar anomaly, or to dismiss this type of anomaly and stop hearing alerts about similar anomalies.
“What if” modeling system
For the “What If” modeling system, I decided to make it into a cost scenario builder. The user accesses this system from the budgets and goals area, an area that is similar in use to scenario building because it is about future planning regarding expenses. From here, the user can test out what new recurring costs would do to monthly costs, or she can modify existing recurring costs that the system has identified and see how modifying those costs would affect monthly costs overall.
In my wireframe flow, the scenario depicts a user testing out how she can afford a massage. She creates a new scenario, adds a massage cost that will be monthly, and then tests out downgrading her cable and eliminating a monthly water-cooler service. In summary, she finds she only has an increased cost of a bit over a dollar if she were to take this strategy in adjusting her monthly costs and services.
She then saves the scenario. This feature allows her to test and compare scenarios or to share them with someone like a roommate, partner, or business associate, based on how they manage finances and who else may need to know about these changes before making a decision.
The biggest challenge I heard from users regarding this scenario is the complication of going into each cost, modifying them, and then returning to the scenario builder screen. In the future, I will try out different interfaces that put all the controls and feedback elements on the same screen. Sliders, pickers, and graphical feedback elements may help centralize the interactions on one screen.
Safe to spend
Regarding safe to spend, I find the best way to help people quickly understand how much they have to spend is by visualizing budgets effortlessly and quickly. I find the “Safe to spend” paradigm in apps like Simple too cumbersome, confusing, and requiring too much training and user input to be useful. There are also too many opportunities for assumptions about transactions to rely on the banking app to decide what is safe to spend or not. I created a quick way to view account balances and budgets in particular to alert the user what money they should consider available at any point in time. This ease of access and visibility is the most important part of helping users understand their finances, as many banking apps do not make this information easy enough to access or read.
Overall, these past eight weeks have been eye-openers. The most important lesson I learned were the following:
Start with Low-Fidelity
In making the first set of screens, I started by modeling my work on the Wells Fargo app and brought it to a high level of fidelity. This made it very difficult to go back and make changes to the app as needed. In the future, I now know to go slowly in building up fidelity, and I plan to do as much by hand as possible before committing to digital mock-ups.
Spend more time studying best practices and paradigms
The other challenge that came up in following the Wells Fargo app was that I used poor interaction paradigms. I assumed Wells Fargo knew good design – it’s a big company! But that is not entirely true. The app doesn’t look or feel like iOS almost at all. Fortunately I began studying the iOS design guidelines and read about best practices mid-way through the 8-week class. I used this to inform the recent projects, and in the future I will always spend time looking for best-case examples of work when developing my sense for paradigms and best practices.
Interaction design is a challenging field, but the last lesson I learned is that through rapid iteration and usability tests, we can learn much more than through endless planning and design in a silo. I look forward to next quarter when we will apply these techniques to designing and developing our own apps. For now, it’s time for December break. Happy Holidays!
This week, instead of wrapping up the remaining screens needed for the app we were given a scenario. Our task was to implement new features from a company that our bank had acquired. The features revolved around financial modeling, statistical trends, and managing spending habits. To create these screens I looked at several apps and secondary sources to create an experience for the user that allows them gain valuable insights into their spending habits. The app also gives recommendations on these insights that present ways the user might save money or change habitual excessive spending.
Testing This Week
Last week in class we learned about Cognitive Walkthroughs and Heuristic Evaluation, both of which are tools a designer uses to gather feedback. Cognitive Walkthrough is defined as, “A method for evaluating the learnability of a product, based on a theory of problem solving in unfamiliar situations.” Heuristic Evaluation is where you, “compare an interface to an established list of best practices to identify usability problems.” Much like Usability testing the methods focus on a user and whether not the interface makes sense to the user. The difference between cognitive walkthroughs and heuristic evaluation, and Usability testing is they do not require testing with a person. Our faculty urged us in class to lean more towards Usability Testing going forward into roles outside the school because the data you gather from açtual people is always going to be richer. That being said, I was curious to try Cognitive Walkthrough to see if it proved to be useful.
I started by sketching out my new screens and I quickly began to go no where. I was not in the space to create up something from scratch. So I went to Mint, a budgeting app I have on my phone that allows me to see trends and budgets I have set up for my spending. I personally have never really like Mint because after the initial download and the cool visuals have worn off, there’s no real value in simply seeing that I am going over budget. I have always wanted to have the app tell me specific ways to reduce spending habits and because of this assignment I was given an opportunity to create a feature that did just that.
Molding Two Ideas
You might remember in my previous blog post that I decide to focus the user interface of my banking app around the idea of an in-and-out framework. I admire baking apps like Venmo or Cash that allow its users to get into the app and quickly perform their task and be done with it. The current Randolph Brooks app is confusing and it’s a long winded journey doing even the simplest of tasks like checking your actual Checking balance. So, I decided that instead of creating a new page or section dedicated to optimizing spending and seeing trends, that I would just modify the existing Accounts page to include these trends. I created an accounts page similar to home page in Mint with transactions and budget snapshots being on the first page. However, I made sure to ask “Will the user try to achieve the right affect?” with each goal the user is trying to accomplish, as part of my cognitive walkthrough testing. I found that if their goal was hard to pinpoint with regards to optimizing spending habits. If my goal was to have my app be a quick in and out functionality, then crafting it around Mint would not be beneficial because everything takes several steps to set up in Mint before you can have actual snapshots of your data.
After asking more of these structured questions in my cognitive walkthrough I decided on the screens you see below.
I created an accounts page with snapshots of first glance spending trends in each account. Upon clicking into an account you see a circular chart much like the one in Mint and just below you see the recent transactions going in and coming out of your account. If the user comes into the app wishing to see how they might optimize a certain category of their spending they are prompted to click on that part of the circular chart and it will tell them whether their spending is excessive, fair, or optimal already. Then they click the button, “Optimize” and the app starts working. They are left with a screen that shows history of spending in a graph, detailing the highest spending period and lowest spending in the past six months. Then through algorithmic data the app would give a recommendation on how to reduce excessive spending based on this historical data.
In the end I created three flows related to fixing spending habits, each of whom I would like to go out and perform actual Usability Testing on because I feel the overall framework will stand up to criticism but I know that it may not flow as seamlessly as I would like. Going forward I will continue to create the rest of the screens and I will use this shift in scope as an opportunity to branch out into new ideas that I might use in this banking app to improve the experience for the user.