
NDA Recreation
Click here for rationale
Industry
Alternative Energy / Renewables
Disciplines
UX & Digital Design


Introduction
Following from Part 1 ~ the final portion of this NDA recreation is the Web Design comprising of User Experience research, Information Architecture, high fidelity visualization and front-end development instance trial with Framer®.
As this is fictionalised re-work based on actual brief ~ Impact statements are not available. However, a series of criteria(s) are presented at the end of this presentation typically raised during retrospective settings.
Problem Statement
An alternative-energy producer requested a website re-design, citing needs for scalability of content management and to highlight the competitive proposition(s) of the emerging, government-backed and supported framework “ESG” ~ Environmental Social Governance.

Viewable pages
Within front-end capabilities restricted to a feasible scope, an upskilling initiative within Framer® was conducted to provide as native and/or "out of the box" experience as possible, with as few reliance on third party integrations.
The following pages are available for review and visitation:
Our Team / Board of directors and management
CMS Functionality #1 - Our Products (Water, Wind, Solar)
CMS Functionality #2 - Our Blog (with six writing manually retailored ~ articles)
A fully narrated Case Study video below outlines this NDA recreated project's entirety, from start to end. Edited and cut with Final Cut Pro X.
Demographics
Investors on the energy sector, particularly emerging markets on the renewable energy (solar, wind, and green hydrogen).
30-55 years of age.
Relatively higher income presuming existing familiarity surrounding finance / fin-etch and investing.





SWIPE
Sundar Kamar Singh
Archetype ~ “The Investor”
42 years
Perth, Western Australia
Senior Engineering Consultant / investment enthusiast amongst future derivatives and various cryptocurrency initiative(s).
Introvert
Extrovert
Analytical
Creative
Busy
Time Rich
Messy
Organized
Independent
Team Player
Safe
Risky
Background
Sundar came from a humble, working class family from Pakistan. With a bachelor with honours on Engineering and Sociology, he quickly accumulated expertise and respect firstly as a consultant on smaller to then gradually larger ~ various government sponsored infrastructure projects.
In 2010, Sundar made the move to the sunny side of Queensland, Adelaide where he pursued, on top of engineering ~ personal interests surrounding investing and wealth building.
Today, Sundar works as a chief consultant for a prolific mining firm. However, at his spare time he frequent various blogs, and social media channels on emerging financial interests ranging from cryptocurrency, fintech, and enviro-blockchain projects particularly from Australia then globally abroad.
Sundar is renowned by his peers to be down-to-earth amidst all stakeholder interactions. Calculated and skeptical to anything new or novel, he is reserved to not express opinions . Wherever away from the digital screens, he is occupied with his beloved family of three children and golden retriever.
Industry & Interests
Needs & Goals
Motivations
Pain Points & Frustrations
1 - Journey Map / Summary of Persona Narrative
Our persona features a prospective investor whose interest revolves around emerging trends on sustainability and responsibly-driven investments within framework known as ESG; offering competitive returns through capital growth above those not on the framework.
The user’s current branding personalities are also outlined; highlighting sources and/or brands trusted for thought-leadership surrounding the above topics.
The entire Customer Journey Map here uncovers the user’s initial pain points among the few companies shortlisted out of engagement interest; chiefly among them a lack of transparency amidst claims and propositions on the investment products. Resolution is reached when these pain points were addressed as the user interacted with the customer experience team; leading to the onboarding process.

Sample User Journey Map
Key Extrapolations
Taking all the above in mind, there were several key implementations that the design solution should carry somewhere in the high fidelity visualisations:
Having clear thought leadership articles and feature page/s outlining propositions, differences, pros and cons amidst ESG versus non-ESG based investment products.
Following from each article offer CTA / call to actions ~ that relates to the subject matter within each blog article to invite deeper enquiring, rather than generic templated Newsletter sign up banners or “contact us” today.
2 - Development - IA & (Mini) Service Blueprint
Here the proposed information architecture / sitemapping outline the entire structure of the website from a highly summarised, 1,000 foot view.
Then accompanied with Functional Journey Map (also known as Functional blueprint) ~ helps uncover and address any Functional features required to address common anxieties; raised through a series of questions.

3 - The High Fidelity Visualizations
Soon follows the low to high fidelity visualization within Figma®; taking into account all aesthetic descisions as disclosed in Part 1 of this NDA recreation case study.
By utisiling the custom retailored DS / design system, a number of key pages were produced in the aim to produce most desireable length and depth of copy / content writing parameters.
4 - The Front-end development Prototype
As additional incentive to this NDA Recreation, a Front-end development prototype was further exercised in Framer®.Click here to view the build prototype.
Limitations of this front-end development trial
This prototype is only a hypothetical envisioning of design to development translation among key static and in some respect - dynamic (CMS) pages only in demonstrative capacity. The many out-of-scope functionalities uncovered during The Functional / Service Blueprinting phase, could not be translated here in this front-end showcase.






SWIPE
Post Project Outcome / Criteria
I humbly disclose that at the time of industry conduct ~ any or all impact statements were strictly forbidden for me to query and/or simply unobtainable. The following criteria below are what I would raise soon after a Project surpasses their service period; as hypothetical “Retrospective” .

About this Case Study
Unless otherwise explicitly specified - all artworks, including naming, titling, sample content-writing including this Case study, and the entire front-end development ~ have NOT been entirely resorted through Artificial Intelligence, or generative tools.
All hours expended on each NDA re-creation(s) were conducted out of limited, personal and voluntary capacity on top of / during full time tenure.

