Green Circle
Clean Energy Marketplace App
Mobile app developed for the Iniciativa Climática de México (ICM) to help users discover and connect with certified providers of clean energy solutions such as solar panels and solar heaters.
%2012_38_02%E2%80%AFp_m_.png)
%2012_57_58%E2%80%AFp_m_.png)
PROBLEM
People couldn’t easily find reliable, certified clean-energy providers from mobile. Information was scattered, trust was low, and actions (contacting a provider) took too many steps.
GOAL
Make discovery fast (browse, search, filters).
Keep the UI simple, native and accessible.
Reduce friction to contact a provider in one clear flow.
IMPACT
-
A shared component library sped up iOS delivery and reduced UI inconsistencies in.
-
Clear flows (browse → filter → provider → contact) lowered friction for users to reach certified providers.
-
For ICM, the app makes it easier for people to act on clean-energy options, supporting environmental and social impact by reducing barriers to adoption.
What I learned
-
Working with the Spotify model (squad rhythm, chapter/guild syncs) to ship in small, steady increments.
-
Swift/SwiftUI basics (MVVM) and how to keep design and code aligned.
-
How to design iOS components with clear APIs, states, and docs.
-
The value of time management and clear communication across design and engineering.
FIRST DRAFTS
ios components.
Designed a reusable iOS component set so the squad could build screens like building blocks.
-
Tokens: color, typography, spacing, radius.
-
States & variants: loading, empty, error, disabled, focus/active.
low-fi.
We created low-fi wireframes to define the app’s structure and flow.
They outline the core screens (home, list, detail), basic navigation, key content sections, and where the main actions live.
Copy is short and neutral; visuals are plain on purpose.
Result: a clear blueprint for hi-fi design and iOS build.
DESIGN
color palette.
We created the palette to feel trustworthy, sustainable, and clear.
-
Primary green: stands for clean energy; used for main actions.
-
Secondary blue: adds trust and clarity in lists and filters.
-
Neutrals (jet+ white): strong readability AA contrast; content stays in focus.
We avoided “neon eco” colors and kept saturation moderate for a professional, credible look.
Responsibilities
-
UI squad member for iOS.
-
Designed the iOS component library and documented tokens/usage.
-
Reviewed and approved iOS UIs from teammates; gave practical feedback.
-
Supported front-end coding (SwiftUI views, states, small fixes).
-
Kept accessibility basics (Dynamic Type, contrast, touch targets) in place.