The
LAFPC is a non-profit organization working to ensure that there is healthy, sustainable, and fair food in the LA system through education and out-reach programs.
As a Hackathon client, they needed help to build an extension of their current site to allow organizations easy access to resources to impact LA food initiatives. A team of two designers, including myself, and three developers worked in a 3 week sprint to ship this experience. Our designs placed 1st overall.
✧ Title – UX Designer
✧ Role – Ran competitor analysis sessions and stakeholder interviews. Worked with a team of developers to build out the web app.
✧ Result – Placed 1st in the Hackathon for our designs and usability.
✧ Tools – Adobe Xd, Figma, Zeplin
The LA Food Policy Council collects data on the LA community and it's food initiatives. The team's responsibility was to create a usable system that not only allowed users to visualize and comb through data, but also provide administrative access to update the data as time progresses.
We broke down our user's goals we wanted the product to successfully accomplish before our submission for the Hackathon. This checklist gave us a clear understanding of what we should achieve within a 3-day time constraint. ​
[1]
The ability access info in relation to the 4 core values:Â Healthy, Affordable, Sustainable, and Fair.
[2]
The ability access info in relation to the 4 core values:Â Healthy, Affordable, Sustainable, and Fair.
[3]
To download data, case studies, and visualizations in the format they see fit.
[4]
Administrative ability for LAFPC representatives to update and input data whenever necessary.
To hit the ground running, Jessica and I analyzed other data systems that functioned the same way we envisioned our own dashboard to perform. This also included tools that the LAFPC developed an affinity for when conducting their own research.
To hit the ground running, Jessica and I analyzed other data systems that functioned the same way we envisioned our own dashboard to perform. This also included tools that the LAFPC developed an affinity for when conducting their own research.
THE SOUTHERN CALI GEO COORDINATION CENTER
This website and its geographic tool had clearly marked administrative and legend sections that is useful when organizing large data sets. A design pattern we wanted to incorporate in our own designs is the use of colors to denote different types of data.
CLEAR IMPACT'S PERFORMANCE MANANGEMENT SOFTWARE
Visualizing data as a scorecard is a quick and intuitive way to highlight data trends. And when combined with expandable and collapsable functions, it can prove useful to diving deeper into the data as well.
LAÂ RIVERÂ INDEX
The LA River Index does a great job of organizing their content and data into categories with related information and graphic links to provide context around the subject.
STAKEHOLDERÂ INTERVIEW
In order to determine if our direction aligned with the requirements and vision of the client, I spoke with LAFPC's Emerson Hunger Fellow representative, Chloe Green. Her input was invaluable.
It helped us re-organize our information architecture as well as decide on features that made sense for the tool.​ She said "If the data isn't easy to find, people aren't going to use it." and pointed us in the direction of a color-coded modular design.
LOFIÂ PROTOTYPES
Jessica and I made a conscious effort to include our team of developers in the design process as much as possible. We understood that we needed to work within their constraints when it comes to coding functional elements which in turn would affect the foundation of our dashboard.​
Once we developed a lo-fidelity prototype, we had them test the design and gathered their input on usability issues. This benefitted the team especially in a 3-day span where iterations on the wrong design would have been costly.
Hompage
Dashboard
Content Screen
HOMEPAGE
The homepage was built to inform new users of the dashboard's purpose and how properly navigate through it. ​It also showcases new geographic information for returning users as well.
DASHBOARDÂ HOMEPAGE
The tiles on the homepage links to the dashboard corresponding to the LAFPC's 4 values. They have access to the toolkit, scorecard, and any visual downloads.​
All of these elements have expand and collapsable functionality. Inspiration was taken from our competitive analysis.
ADMINÂ LOGIN
One of our most important goals was to give the administrators a means to update the data or else this tool would become obsolete as the data becomes outdated.
DATA INPUT
The tiles on the homepage links to the dashboard corresponding to the LAFPC's 4 values. They have access to the toolkit, scorecard, and any visual downloads.​
All of these elements have expand and collapsable functionality. Inspiration was taken from our competitive analysis.
The work done for this hackathon stressed the importance of communicating not only between designers but across departments as well. I would recommend a more structured process the next go-around like a daily scrum or utilizing a kanban flow.
Overall it was a great experience working closely with a team of 3 developers and happy our designs were deemed most usable.
