Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

home page text revision #290

Merged
merged 5 commits into from
Oct 15, 2024
Merged

home page text revision #290

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
12e1b84
Adding static KPIs and slogan modification
omranlm Oct 9, 2024
75fe931
Modify narrative for fair process and community approach
omranlm Oct 9, 2024
f27082a
adding 4th KPI, accepted predictions
omranlm Oct 15, 2024
b2a3a5f
Adding FQA and call for action section narratives
omranlm Oct 15, 2024
162edd9
Nw images for homepage
omranlm Oct 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified frontend/src/assets/images/header_bg.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified frontend/src/assets/images/hot_team.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 5 additions & 1 deletion frontend/src/components/landing/cta/cta.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@ import { APP_CONTENT } from "@/utils";
import { Image } from "@/components/ui/image";

const CallToAction = () => {
const joinTheCommunityClick = () =>
{
window.open("https://slack.hotosm.org/")
}
return (
<section className={styles.container}>
<div className={styles.cta}>
Expand All @@ -13,7 +17,7 @@ const CallToAction = () => {
<p>{APP_CONTENT.homepage.callToAction.paragraph}</p>
</div>
<div className={styles.ctaButtonContainer}>
<Button variant="primary">
<Button variant="primary" onClick={joinTheCommunityClick}>
{" "}
{APP_CONTENT.homepage.callToAction.ctaButton}
</Button>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/landing/fair-process/fair-process.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ const TheFAIRProcess = () => {
return (
<section className={styles.fairProcess} ref={containerRef}>
<h2 className="text-title-2 lg:text-4xl font-semibold mb-[73px]">
The fAIr process
{APP_CONTENT.homepage.fairProcess.title}
</h2>
<ol className="flex flex-col md:flex-row justify-between items-start w-full">
{steps.map((step, id) => (
Expand Down
24 changes: 15 additions & 9 deletions frontend/src/components/landing/kpi/kpi.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { APP_CONTENT } from "@/utils";
import styles from "./kpi.module.css";

type TKPIS = {
Expand All @@ -7,21 +8,26 @@ type TKPIS = {

const KPIs: TKPIS = [
{
figure: "162,1M",
label: "Building Mapped",
figure: "15",
label: APP_CONTENT.homepage.kpi.publishedAIModels,
},
{
figure: "590",
label: "Published Models",
figure: "120",
label: APP_CONTENT.homepage.kpi.totalUsers,
},
{
figure: "100.3K",
label: "Mappers",
figure: "100",
label: APP_CONTENT.homepage.kpi.humanFeedback,
},
{
figure: "86",
label: "Mappers",
},
figure: "15",
label: APP_CONTENT.homepage.kpi.acceptedPrediction,
}
// ,
// {
// figure: "86",
// label: "Mappers",
// },
];

const Kpi = () => {
Expand Down
39 changes: 22 additions & 17 deletions frontend/src/utils/content.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
// for easier internalization when necessary.

import { APPLICATION_ROUTES } from "./constants";

export const APP_CONTENT = {
navbar: {
logoAlt: "HOT fAIr Logo",
Expand All @@ -23,7 +22,7 @@ export const APP_CONTENT = {
},
footer: {
title:
"fAIr is a platform where individuals can use an AI model for mapping in OpenStreetMap",
"We pursue Just tech to amplify connections between human[itarian] needs and open map data.",
copyright: {
firstSegment:
"Images are screenshots of fAIr may be shared under a Creatives Commons Attribution-ShareAlike 4.0 International License.",
Expand Down Expand Up @@ -69,38 +68,45 @@ export const APP_CONTENT = {
homepage: {
jumbotronTitle: "Your AI Mapping Partner",
jumbotronHeadline:
"AI-powered assistant that replicates your mapping samples intelligently and quickly, helping you map smarter and faster.",
"AI-powered assistant that amplify your mapping efforts intelligently and quickly, helping you map smarter and faster.",
ctaPrimaryButton: "Create Model",
ctaSecondaryButton: "Start Mapping",
jumbotronImageAlt: "A user engaging in a mapping activity",
kpi: {
publishedAIModels:"Published AI Models",
totalUsers:"Total Registered Users",
humanFeedback: "Human Feedbacks",
acceptedPrediction: "Accepted Prediction"
},
aboutTitle: "WHAT IS fAIr?",
aboutContent: `fAIr is an open AI-assisted mapping platform developed by the Humanitarian OpenStreetMap Team (HOT) that aims to improve the efficiency and accuracy of mapping efforts for humanitarian purposes. The service uses AI models, specifically computer vision techniques, to detect objects in satellite and UAV imagery.`,
aboutContent: `fAIr is an open AI-assisted mapping service developed by the Humanitarian OpenStreetMap Team (HOT) that aims to improve the efficiency and accuracy of mapping efforts for humanitarian purposes. The service uses AI models, specifically computer vision techniques, to detect objects in satellite and UAV imagery.`,
fairProcess: {
title: "fAIr process",
stepOne: {
title: "Create Model",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"Create a customized and localized AI models using open source (or your) imagery and your customized labels with support by OSM open data",
},
stepTwo: {
title: "Run Prediction",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"Run prediction/inference in a live environment or define your area of interest to run your local model and get the data.",
},
stepThree: {
title: "Feedback",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"Get live human feedback about the quality of your localized model to support your decision to enhance the model accuracy.",
},
stepFour: {
title: "Use Data",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"Make the produced data open and available for humanitarian actors to take actions for impact",
},
},
coreFeatures: {
featureOne: "Time Efficient",
featureTwo: "High Accuracy",
featureThree: "Time Efficient",
featureThree: "Re-usable/Resilience",
},
coreValues: {
sectionTitle: {
Expand All @@ -113,12 +119,12 @@ export const APP_CONTENT = {
community: {
title: "Community Driven",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"fAIr follows a community driven approach to decide on the features that will be implemented. We are continuously engaging with local communities to shape the direction and the future of AI-assisted humanitarian mapping",
},
humansNotReplaced: {
title: "Humans not Replaced",
title: "Humans in the loop",
description:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.",
"As part of the community approach, humans are involved in the whole fAIr process, from creating models till reaching high quality data and gather feedback",
},
},
faqs: {
Expand All @@ -128,17 +134,17 @@ export const APP_CONTENT = {
{
question: "What is fAIr?",
answer:
" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
"fAIr is a free and open source AI assisted mapping tool that gives local communities the ability to create their localized AI models to amplify their humanitarian mapping efforts.",
},
{
question: "Who can use fAIr?",
answer:
" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
"Anyone can use fAIr with basic authentication (log in) and they will be able to explore the community crated AI models and use them for mapping and create their own new models.",
},
{
question: "Can I use fAIr without having a sound knowledge of AI?",
answer:
" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
"fAIr is design for users without the need for python or any programming skills. However, basic knowledge in humanitarian mapping and Geographical Information Systems (GIS) would be sufficient for self exploration.",
},
],
},
Expand All @@ -152,8 +158,7 @@ export const APP_CONTENT = {
callToAction: {
title: `We can't do it without you`,
ctaButton: "Join The Community",
paragraph:
" Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fugiat esse ipsam amet molestias impedit at nulla fuga, sed ducimus nesciunt dolore facere cum velit voluptatem provident reiciendis iure quo rerum.",
paragraph: "fAIr is a collaborative project. We welcome all types of experience to join our community on HOTOSM Slack. There is always a room for AI/ML for earth observation expertise, community engagement enthusiastic, academic researcher or student looking for an academic challenge around social impact."
},
},
pageNotFound: {
Expand Down
Loading