EcoServants Brand Development
©
The Problem
The Ecoservant brand lacks a fully developed visual direction. While colors and fonts are defined, the overall aesthetic needs refinement and cohesion.
The Solution
To create an art-driven content system that engages a global audience and strengthens EcoServants’ mission. A cohesive mood board and clear design assets will guide volunteers of all levels to contribute with consistency and shared creative vision in a way thats fun for everybody.
The Goal
To create a cohesive, handcrafted visual identity where pastel tones, paper textures, and organic artwork convey a friendly, human feel—reflecting EcoServants’ authentic, hands-on values and making the brand instantly recognizable.
*
"By referencing the brand’s website and front-page declaration at EcoServantsProject.org, I expanded and refined the following brand elements to guide all design work moving forward."
.jpg)
*
"EcoServants already has a Logo System finalized, so I referenced that design along the way."
Typeface System
*
"This system creates a clean, modern grid (Inter) with a warm, crafted undertone (Lora + Iris Germanica). It aligns perfectly with a brand that uses handmade illustrations, paper textures, and natural aesthetics."
Color System
*
"Using the brand’s established color palette, I defined precise color specifications—including HEX, RGB, CMYK, and Pantone values and usage ratios—ensuring consistent application across digital, print, and auxiliary color systems."
Usage Ratio
60%
30%
10%
Contrast
EcoServants
EcoServants
Illustrative Assets / Iconography
*
“After sketching the icons, I digitally refined the same organic line work style and selected the core symbols, noting that interchangeable icons—like Earth vs. recycling or leaf vs. heart-leaf—can be swapped as needed. Any future additions to the icon kit can follow the guidelines listed below for consistency across all platforms."
10B Sketch Pencil for grainy, bold linework
🌱 Sprout / Growth
-
Purpose: Used to mark beginnings — the start of a project phase, concept birth, or origin point in a workflow.
-
Why it exists: Quickly communicates “initiate,” “grow,” or “start here” in timeline.
🌳 Tree
-
Purpose: Indicates long-term progress, stability, or major milestones.
-
Why it exists: Communicates maturity, deeper sustainability impact, or established commitments.
💲 Dollar Sign
-
Purpose: Marks donations, funding, savings, or eco-cost transparency.
-
Why it exists: Helps users quickly identify anything tied to financial contributions or sustainable spending.
📖 Open Book
-
Purpose: Indicates education, learning resources, guides, or tutorials.
-
Why it exists: Anchors the system’s informative and knowledge-driven content.
👕 T-Shirt
-
Purpose: Represents merch, ethical fashion, or sustainable apparel tips.
-
Why it exists: Provides a clear visual cue for lifestyle-based, wearable impact actions.
💚🍃 Heart + Leaf
-
Purpose: Shows values, mission, or user impact metrics.
-
Why it exists: Combines emotion + sustainability, reinforcing brand identity and care-driven actions.
🎟️ Ticket / Pass
-
Purpose: Marks events, access, memberships, or exclusive experiences.
-
Why it exists: Creates a consistent visual for participation, community involvement, and special perks.
👥 Community Group
-
Purpose: Identifies forums, collective action, group challenges, or shared chats.
-
Why it exists: Orients users toward social engagement and community-driven environmental impact.
Brand Application Design
*
"I've created optimized homepage prototypes that refine user flow and conversion, incorporating custom handcrafted iconography and low-fidelity wireframes. This groundwork establishes a strong foundation before the designs move further along the process, supported by my art direction and design recommendations."
Phone Wireframe
Web Wireframe
BEFORE: This is their homepage prior to optimization.
AFTER: This draft represents the initial phase of the homepage rebrand, before core color strategy, and content are established to refine and expand in the subsequent design stages.
This homepage format is optimized across four key areas:
-
Emotional Impact
The introduction banner and overall aesthetic immediately communicate a grassroots, humble, community-driven tone, creating an instant human-centered connection. -
Intuitive Navigation
Custom iconography surfaces every major section as a clear, direct hyperlink, reducing clicks, scrolling, and cognitive load so users can find essential information quickly. -
Scannable “Notecard” Highlights
Paper-style note cards present EcoServants’ most important updates, visuals, or calls to action in a familiar bulletin-board format. Each card also functions as an alternate navigation path, linking users to the same key pages as the main icons. -
Conversion-Focused Footer
A higher-placed footer reduces unnecessary scrolling and prioritizes email capture, strengthening direct outreach beyond social media dependence.
Maintaining a consistent type system and color palette across the rest of the website ensures professionalism while keeping production time efficient, even with the homepage using a more thematic visual treatment.
*
"After consolidating the brand assets, I delivered them in a comprehensive PDF package to the Copywriting and Content teams for finalization while the website remains in development."
EcoServants Content Creation
©
The Problem
The EcoServants team needs to attract a larger pool of volunteers who are passionate about learning environmental issues and may contribute.
The Solution
Develop visually engaging digital flyers that align with the EcoServants brand identity, enhance brand recognition, and drive volunteer engagement.
The Goal
Design Assets
Design a minimalist, hierarchical layout that guides the viewer top-to-bottom, grabs attention in the first five seconds.
The Process
I sketched key visual assets on paper to establish the initial layout structure efficiently.
Through iterative variations—typically 4 to 8 per round—I refined composition and balance, ensuring optimal use of negative space, or "ma", inspired by Japanese design principles.
This approach enabled intuitive exploration of form and hierarchy while preserving time for high-fidelity detailing in the final stage.
Final Visual
.jpg)