The Shutterstock AR project was conceived of this past fall when the Shutterstock mobile apps team was challenged to come up with an idea for the internal company hackathon. The team recalled that several users mentioned that they would love to be able to view Shutterstock images placed on a wall to help them decide which image to buy.
The team decided for the hackathon (within 24 hours) they were going to try to create an AR experience for where you can view any Shutterstock image in augmented reality (AR).
Although the team didn’t win the hackathon the AR project did catch the eye of Shutterstock CEO Jon Oringer when he said to the team “so when can we have this in production?”
Within just a few short months the mobile apps team created a simple but fun AR experience that you can try out today in our iOS consumer application.
I took the opportunity to explore what a light but impactful visual change might look like for the Shutterstock consumer app home page.
This page will detail how I would suggest we avoid the need for a CMS and use perhaps ready made parallax components to build this visual hero and search bar for our app homepage.
This feature is not in the app currently but on the roadmap for 2019.
Shutterstock’s consumer prior to this year NEVER allowed for users to pay for a single image. But now you can!
On iOS and Android devices you can now use a subscription OR pay for a single image at any time.
I also worked to change the asset detail page (the page where the image details are displayed) so that it was all on one page. Prior to this change one had to make several taps in order to see details about similar images, keywords, and artist information.
This page will dive into the details of this project further.
Shutterstock’s consumer application had a problem: upon download users didn’t know what the app was about NOR have the ability to login.
Well, we decided to fix that.
Read the problem and solution we came up with. This is now live on iOS and soon will be available on Android as well.
My work at Shutterstock in many ways has just begun. This project is an example of that. This is a design refresh that I worked on.
This is the Shutterstock contributor app which allows our photographers to upload and check the status of their sales within Shutterstock.
Update the look of the app without impacting any core UX flows at this time. Therefore a quick look update and not any UX updates at this time. This is therefore called Part 1, Part 2 will address all the other usability concerns. That will come in 2019.
We had to switch to a light theme in order to get the app more up to date with the current branding at Shutterstock.
We also updated some colors, icons, and buttons.
For more information please read our blog post about the project.
This is a sample idea for Google to inform people what the service might be like at local businesses. It also helps to inform business owners about potintial problems in their establishment with out hurting their overall rating in Google.
Getting content into the platform used to be a pain! This content loader I built with Dubsmash allows us and our partners (Movie and TV studios) to upload content to the back end that is then live on the app. Multi level permissions let users approve or reject content as it comes in allowing an admin to have full control over what goes in the app.
While I was first tasked with working on the app improvements when i first started Dubsmash the team noted my history of building clean looking SaaS tools. I worked on the requirement gathering, user flows, stakeholder interviews, UX, UI, and PO of this project. I also worked closely with the dev team when questions arose and modified tickets if required.
This project posed scope creep challenges left and right as any SaaS tool does. Here we have 2 levels of permissions but soon we will expand it to have more permissions and controls. I kept this in mind when designing the tool so that the primary and secondary nav would have a place to expand to as requirements grew for this tool.
Its probably obvious that I looked to Material Design patterns for inspiration with the brands new color scheme (new logo isn't quite ready yet). The idea was to execute a design that had a clear pattern for creation, the plus signs on top right, that was away from the navigation items. The creation button was inspired by a material design concept of the "fab" button but here I have located it on the top right so that its more visible to all users but especially users that may not be used to google products.
One of the biggest recommendations I have that I learned from this project is to think carefully about your sorting needs inside a list view. The application of multiple sorts can make for a very complex user story and experience for your user. I took inspiration from existing google tools for how I ended up building the sorting in this tool.
This tool is not available to the public yet but we hope that it will be in 2018.
Its been a long time coming but Dubsmash is inching closer to having a whole new product ready for the world. Ive enjoyed being a part of the process and I cant wait for you all to get your hands on it.
Were still testing here and the screens I'm sure will change a bit before launch but were excited to get it out soon, hoping for Q1 2018.
If you are unfamiliar with Dubsmash please watch the first video available on the right.
I started on the Dubsmash product team in the Summer of 2017 tasked with figuring out the best approach to app improvements, increasing time on app, and doing qualitative user testing to make sure our approaches were getting the response we wanted. I did the requiremnt gathering, user interviews, user flows, UX and UI for both native platforms. The other goal was to broaden the user base, make the app easy to navigate and understand so that users of all ages can enjoy it.
There are many challenges with this product as we just have so many ideas and had to prioritize and use the testing to influence what we work on first. We spent some time making improvements to the exiting app (the one live now) putting sharing back into the app as well as feedback cards on the videos we placed on the home screen to evaluate what was working and what wasn't (spoiler alert, the Kardashian material almost always did well).
The new app show cases categorization, easier search and will have personalized curated results every time you open the app. Users were craving organization and I'm happy to say the new app is going to deliver.
When working on an app that is primarily used by youth but you are trying to broaden it to a wider user base its important to keep in mind fun elements that younger users will like such as icons, emojis and colors but at the same time make it organized and logically labeled so that all users can enjoy it.
See more at http://dubsmash.com/
Burning Glass’ Talent platform enables corporations to discover, understand, and acquire the skills needed to develop their talent pool to successfully execute the company’s business strategy.
The goal of the tool is to compare today’s talent with tomorrow’s needs. Supporting this plan, Burning Glass Talent enables insightful data and analysis to close any gaps so you can execute your company’s business plan.
The challenge posed with this project is handling entry of data and displaying of many different types of information in a way that is clear.
Burning Glass approached me as a freelancer to research, strategize, and implement UXUI for this new tool.
I researched other recruiting and data tools to find the best mix of what was working and what was not to create a tool that would be rich with data yet easy to use and understand.
The biggest challenge with this project was figuring out what features were critical and which were nice to have. It was key to prioritize the features because it beacme clear eearly on in the project that fitting in all the features Burning Glass wanted would make for a croweded and heavy prodcut.
I worked closely with the client to vet each feature and determine its importance within the tool.
The main area of the tool that I focused on was the building of the job description as this was the most complex part of this tool. I made the first step, the choosing of if they wanted to start with a url, document, etc simple to understand with descriptions and icons. One thing I tried to be very conscious of is that the user isn't necessarily tech savvy so labeling and instructions were critical throughout the tool. The other thing I worked to maintain is while building the job all the editable areas are on the left then the results will always display on the right. As you move through the tool the layering of the panels indicates what part you are able to edit and what part is the result of what you have entered.
Burning Glass worked closely with Cisco Systems on this project and they had a huge impact on how we developed the features. It was important to keep in mind however to not build this SaaS product with only one company in mind as it might limit its usefulness in other business verticals.
You can see more on their website: http://burning-glass.com/talent/
H2Observer connects users to water data that can help them make insights on their property or infrastructure.
The tool measures 2 main factors RISK and COLLECTION
Risk - Know the water-related risk and threat to your high-value infrastructure. Your high value assets (oil wells, mobile towers, golf courses, highways, landscapes, etc.) are under threat when it comes to water damage. Whether it’s flooding of a nearby river, an incoming storm, or water accumulation due to an above average rainfall, H2Observer’s Risk Assessment application gives you a consolidated view of all water-related threats arising that pose a risk to your high value assets.
Collection - Know the best areas to collect water and perform a ‘what-if’ analysis to get the optimized solutions. Water collection can be extremely complex; physical features such as topography, terrain, weather, rain, and soil water retention all need to be considered while deciding where and how much water is safe to store. H2Observer’s Water Collection application empowers you to make the right decision by not only considering the above-mentioned concerns, but because it provides the ability to change the observer parameters and check how they might affect the overall water collection in various ‘what-if’ scenarios.
I worked as product owner, creative director, and strategist on this project. I worked on the UX fully at the beginning of this project before working in tandem with one of our UXUI designers on the Webonise team. H2Oberver was built in response to another project we were working on that had access to data rich GIS data. This allowed us to build a tool that could allow users to not only look at historical satellite imagery but also assess the flood risk and collection of water opportunities on property of interest.
There wasn't any tools we found out there that were doing anything like this so we tried to keep the requirements small to start so that we could start to build out the tool in a way that would feel easy to users. Once you are in the map visualization area you'll notice that we placed all controls on the right, away from navigation and on its own to clearly define the areas distinct purpose. We did look closely at how Digital Globe was displaying historical satellite images and took some inspiration on the check box and slider usage for the time line.
The solution here marries the ease of a simple tool with the dense data that one needs when assessing land and water. The tool visually feels light and intuitive all while delivering insight you cant get from any other tool.
We went back and forth in wire-framing on the best area to put controls and worked hard to make the right panel the only place to enter or manuiplate input to influence the map area. We had them along the bottom at one point but realized the eye lines were very jumpy, going top to bottom, then left to right, then top to bottom again on the right side of the page. Therefore having the nav top to bottom on the left and the controls top to bottom on the right made the most sense visually and I think worked well here.
You can sign up for beta access at http://h2observer.com/
With ibeacons more of a pain than a solution what if you could leverage the location data of a mobile user. They already have location services on, unlike bluetooth!
With this prototype admin users can set up coordinates, messages and media to push to users when they walk into or drive by their favorite stores.
At Webonise we had an experimental team that would take up fun side projects from time to time. We knew that we wanted to build an app that used geo location so that we could show our existing and potential clients how this technology can be used to message users in physical space. I worked on requirement gathering, UX and UI as well as branding and marketing materials. Typically I would begin the project then assign a designer to continue the process. The video will show some updates that my art director Dana made later on in the project.
We chose to use the open API available from Groupon and Living Social to target deals to app users. The on boarding process included a screen for users to choose what kind of deals they were interested in and that way they only were pushed notifications for discounts they might actually want. For instance if I say I like pizza, if I walk by or drive by a shop that has a deal available the app will notify me of the shop and the discount available, then link the user to make the purchase through Groupon or Living Social
At the time that we build this there wasn't really anyone using geo location for this purpose so we tried to use our imagination to figure out the best way to present users with this concept.
This solution uses a very minimal interface to just deliver the information users need. We have a list view and a map view for easy browsing.
The biggest challenges with geofencing is the unpredictable nature of satellites and location accuracy. We wanted the notification to trigger within just a few feet if the person was walking but realized we had to make the fence wider to accommodate for satellite inaccuracy. This concept is more common now than it was when I worked on this project and is much more accurate now. Im proud that we built something we hadn't seen before and made it feel light and easy.
Unfortunetly this app is not on the app or play stores as it was an experiment and selling tool for the agency.
The top images here show you what the app looked like when we built it. It was built on a hybrid framework. The bottom most images are the MVP we built to test the concept. Here you can also see the back end we built to add manually set geo points if required.
Our client wanted to make managing their seed inventory easier to visualize inside their warehouses. At a glance the user of this platform can see what capacity, restrictions and other statuses are effecting their warehouse in real time. Users select the site location, then the warehouse and can view or search inventory on any level.
This project was done with a large seed manufacturer based in Indiana. We were challenged with creating a tool that a warehouse manager could use to plan, count, and package for shipment seed pallets for shipment around the world. Colors and numbers represented types of seed as well as the status of that row in the warehouse. Floor managers needed to know what row might be getting shipped out soon so they could plan what seed coming in would take its place. When we started this project these managers were using scanners on the floor and didn't really have any way to visually know what went were, it was all done via spreadsheet. I worked as creative lead on this build with my designers Dana Smith and Angie Barker on this project.
This project was especially challenging due to all the granular detail that was required. This site is responsive down to tablet for easy use on the warehouse floor. Making it work in an easy to navigate space while having it be beautiful was super challenging but I think we pulled it off.
When we were making this product I kept thinking about the scene in Jurassic Park where the character zooms though a data base system represented by blocks. I recalled this scene and used it as inspiration for the view of the warehouses.
I embedded that video near the bottom of this page. :D
The solution we developed gave managers a birds eye view of all of the warehouses in the region, then they could drill down into a specific warehouse and see what was happening in each row in the warehouse. They could also mark and make changes inside the tool allowing the entire team to be up to date on the current status of pallets in the warehouse.
A hurdle we had to overcome was the creation of the shapes of the warehouses on the map as this is not easy to do with available GIS data. The warehouse shapes, because there was only a limited number, were created one by one and placed on the map. Design wise I think we might have saved some developer time if we had designed it a bit more simply but it did look beautiful.
Messed with this a little bit in the morning before work.
This is a friends app where you can draw a box around your yard, it gives you an estimate on the cost to mow it and sends out a yard crew to do it for you. Super easy.
Messing around with this beer trading app concept. Lots of UX and UI work to go but so far I'm digging it. Hope to have the prototype updated soon. Playing with the floating bottom right menu concept. Im finding some challenges with it but I do love not straining my thumb to tap the menu!
Made up this identity on my lunch break.
Living in New York, people are often more of a concern to getting around than traffic. I support all reasons to gather, whether it be a protest or just SantaCon, I believe the right to assemble is important to free speech.
That said, knowing where people are congregating can help you better navigate your path for the day. I was in the back of a cab one day wondering if my favorite restaurant was crowded at that moment (they dont take reservations) and if I should try to go by there. That is when the idea of CrowdSwarm was born.
The screens represented here show a protest that took place in Washington Square park late 2014. It interrupted transit, traffic and (you guessed it) walking! If CrowdSwarm was included in your Google map you could have seen what was happening before you even got there.
This idea could be helpful for more than just protests though. What if you could peek at at a concert venue you plan on going at just to see how many people are there now? Or you could zoom in on your favorite mall to see if it is busy?
There are a ton of cool and helpful applications CrowdSwarm could give you.
In case you are not aware, Google maps already uses your location settings on your phone to represent traffic on the map. It uses an algorithm to represent the speed of cars via your phone broadcasting its location. So you, in a way, are already contributing to the data needed for CrowdSwarm. For privacy concerns, I have shown that groups of phones location data will be represented as a mark on the map.
Google has now added a smilar idea where people are tracked but it shows it to you in a bar graph and averages it over time. Very clever way to take the same idea and make it seem less invasive.
I was SO close, but not quite this clever.
Touche google, touche.
ESOL in Higher Ed is a educators platform that links teachers and students to learning materials needed for their college level ESOL classes.
This comp was created around the idea of simplicity yet having a subtle speech bubble hinting to the nature of the program. It is a design that appeals to all age demographics, gender and cultural backgrounds.
This branding was started for a WWII themed brewery. They had planned to have each beer named after an american tank and other patriotic themes.
Turns out the investors didn't like the name. Oh well, still a fun branding project for me.
Player and Foundation sites
This site posed a unique challenge, how do you get across 2 messages at the same time, Vincent Lecavalier the player and Vincent Lecavalier the philanthropist. Once you interact with this site you get that message. From the landing page you are posed with a question, do I want to go and see the player site or the philanthropist site. Once on either site you will see a faint silhouette on the edges, on hover of these you will be shown the opposite site than the one you are on, allowing the user to toggle between both sites.
This site will be fully responsive soon. We launched the desktop site that also works on ipad and the mobile portion will be ready later in spring 2014. Site features sticky dynamic nav on the desktop version and will feature a drawer style menu on the mobile version.
I worked as creative lead on this build with my designer Earnest Gonzales.
View live site at vinny40.com
This exciting new project is currently under development. It will allow for users to manage their fleet of planes and associated cost and maintenance.
Full screen dashboard style responsive.
This is a site that engages social "check ins" and ties those checkins to a donation to a charity or cause of the business's choosing. The main focus of the design of the site is fun, easy, modern and youthful.
This site is fully responsive. Site features sticky dynamic nav on the desktop version and a drawer
style menu on the mobile version.
I worked as creative lead on this build with my designer Jharwin Barrzo.
Rashad Jennings, of the New York Giants, needed a logo for his premiere youth football camp. The camp excelled in taking at risk youth and giving them a positive outlet through athleticism and mentorship.
This logo comp was meant to appeal to all age groups and not look as if its football only, more on the idea of the "turn around" idea of the 180 degrees.
Capital Paper had a logo that served them well for more or less 30 years, but it needed an update. Now that they offer many more services than just paper, it seemed "products" was a more encompassing term.
I freshened up the look by toning down the hue of red, giving it a flat yet slightly 3 dimensional effect. The result is a much more modern approach but keeps the essence of the original logo.
Elizabeth Bradley was in need of a makeover. The demographic of the site skewed mostly female 18-70 years in age. So that meant the approach had to appeal to many different age groups, look expensive and be very easy to navigate.