01. The Problem
The International Fisheries Innovation Network (I-FIN) needed basic branding and a small brochure website developed. As a group, they essentially gathered fishery data analysis and, using this information, sought to provide clear policy guidance to scientists and professionals in the industry.
Their goal was to ensure the adoption and design of sustainable fishery management systems across the globe. As a heavily data-focused entity, they reached out to us at EDF (Environmental Defense Fund) to tackle the “pretty factor” as folks sometimes tend to see it, or the core branding and online presence so the group could reach their target audiences much more effectively.
02. The Solution
I initially tackled the traditional branding needs (logo, a pleasing color palette evocative of the sea, etc.) and then moved onto incorporating them into a system of web ecosystem wireframes and mockups.
We chose to build the site on WordPress using the multifunctional Divi theme underpinning as the site was centered around their stock status tool, the central repository of the data gathering and insights they were focused on presenting. I designed and iterated on a series of visuals for the main pages: Homepage, About, Tools, Contact, etc. and finished populating the website in several weeks. The homepage hero collage was very fun to create!
03. The Process
Designing the branding and website for I-FIN was actually quite enjoyable as the ocean was the theme at the center of the project, so the visual concepts were some of the more satisfying I’ve been in charge of developing.
One core piece of the process I made sure to incorporate was developing wireframes of the site pages for the client before we’d fully designed or coded anything. This exercise makes sure you’re nailing down the information architecture and hierarchy with the client before moving too far ahead. My favorite tool for making wireframes is called “Whimsical Wireframes,” a tool in the “Whimsical” suite of apps that also consists of interfaces to create mind maps and flowcharts among other things. I turn to this tool very often for sorting out nascent ideas.
