worldwide design agencies
-
DateFall 2015
-
Featured onProductHunt, Muzli and more
-
TeamMaxime Bénéteau
Context
If you have been a design student in the past, or if you still are, you probably remember spending ages on Google, trying to find design agencies in a specific country, or anywhere in the world. But getting a clear picture of the design agencies landscape is never an easy task. We tried solving this problem by creating the directory.io, a collaborative directory of worldwide design agencies.
Research
Finding a real need
We talked to a lot of students from several design schools and sent some questionnaires. We quickly realized that there was a serious need because most of them agreed there was no easy way to find agencies.
Even though search engines are especially good for 1-minute searches, it still somehow fails in that kind of research. Apart from that, of course, there already were directories for design agencies out there, but they were all missing something: relevance, usability, user experience...
Screenshots of existing design directories.
Solving the pain points and defining principles
While gathering comments from students and analyzing existing directories during the research phase, we defined some principles:
We needed some kind of relevance in the ordering of the agencies, otherwise it gets messy and there is no starting point for the user.
Text-only directories made the user feel lost or overwhelmed. So pictures are necessary to make it easier to browse through that kind of content.
Too much categorization makes it all complicated somehow.
Adding an agency in existing design directories can be an exhausting task.It should be easy to add an agency.
Defining the experience
After defining the goals, what to do and what to avoid, we focused on defining the experience:
Exploratory
We wanted the experience to feel exploratory. We quickly realized that students don't necessarily know what they are looking for at first, and it's complicated to make agencies fit in a single box. We wanted to create a list of agencies that you could browse through without changing page. To make the navigation as simple as possible, we decided to only offer a location filter.
Visual
We wanted to build a visual directory, using large meaningful pictures to communicate as much information visually as textually.
Practical
We wanted to create an intuitive and easy-to-use service. We would not focus on too many filters, keeping it all simple.
Collaborative
We didn't want the service to look like a lifeless website. On the contrary, we wanted the users to feel like they were taking part in a real community when adding agencies or just visiting the website.
Design and prototype
Quickly build a prototype
After we validated our concept, we worked on the User Interface. We wanted our directory to feel as simple as colorful, and to look serious and fun at the same time. We went for rounded shapes and icons.
Our aim was to first build a functional prototype as fast as possible and make it available for users online, so we could then be able to iterate quickly based on real feedback. We spent the design phase switching between Sketch, SublimeText and Chrome.
Prototype of the website.
Summing up agencies to single tiles
A tile is mainly composed of a screenshot from the agency's website, which helps the user to quickly get the feel of the agency. Then, we have the company name, a description, and the different locations of the agencies' offices around the world. Finally, we have the website address and the twitter account which are related to the company.
A single tile displaying the main pieces of information about an agency.
Multiple cities
Many design companies are split between different offices in different locations around the globe. This can complicate the workflow for the simple user wanting to add an agency: what if he doesn't know all of the locations already? what if the agency is already listed in the directory, but in a different city? Here is how we dealt with that problem and made it simple: Each time an already-existing agency is added with a new location, we just append that new location to the agency tile. This introduced what we call "locations lists" and allowed an easy management of companies that are split between different offices. At the same time, it helps users know how big is an agency at a glance.
Adding an agency
In most of the existing design directories, adding an agency is quite of a painful experience for the user. He has to fill a lengthy form, and then wait for human verification. But we wanted to create a simpler and more exciting way to add an agency, so everyone could easily contribute.
Turning the "add an agency" interaction into an easy and rewarding experience.
Only two fields to create a tile
In terms of content, we needed a description of the agency, the name, the website address, a meaningful picture and the locations. I was able to retrieve most of these details through the URL of the website: we got meaningful pictures by automating snapshots of the websites, and then got the company names, the descriptions, and even the twitter accounts by scraping the META TAGS written in the code of the webpages. But we still wanted the user to fill the location input out by himself in order to avoid mistakes. In the end, while only using two fields, we were able to create a complete and meaningful tile.
Only two inputs to fill out.
However, we wondered if making it too simple to add an agency could have a negative impact on the experience, by making the user feel less useful.
Testing phase
Analyzing users' behaviors
We used HotJar to monitor and analyze our users' behaviors through heatmaps and mouse tracking. It helped us focus our efforts on the right features, instead of going blind.
Heatmap revealing user behavior
Mouse tracking of individual users
Going social
At that time, we wanted to officially launch soon, but we were still trying to define our MVP. We started figuring out that we could go further, and include some social features. Even though we knew that it would not be much used at the beginning, we thought it could be useful in order to measure the engagement of the users and use it as a key metric. We wanted to create an area for students, where they could discover agencies of interest for them, find who works there and get opinions.
Login page
Ownership page - to ask for the ownership of an agency
Agency overview page - with comments from designers
Agency people page - We were so glad to see full design teams signing up
User profile - properly filled-out with some user input and some data we automatically gather from twitter
Getting featured and receiving feedback
During October, we first got featured on Designer News, and then it quickly spread around and we got featured on other communities : Muzli, ProductHunt, SideBar. We started getting a lot of traffic and consequently a lot of sign-ups. We realized that lots of agencies were interested in being listed on our directory, and we figured out that the "design students" were not the best possible target for the service. We needed to focus on agencies instead. Getting as much designers and agencies as possible on our directory, and then targeting people looking for jobs in the design industry.
Some of the feedbacks we gathered
Thanks for reading
