search

KBVE / kbve

KBVE Monorepo
https://kbve.com/
11 stars 12 forks source link

[Concept] Service Page Enchancemnts #2208

Open h0lybyte opened 3 months ago

h0lybyte commented 3 months ago

Describe the bug A clear and concise description of what the bug is:

This bug is a bit of a visual / misinformation bug, the KBVE Services page still has a bunch of boiler plate from older docs. Maybe we could create a new internal (svelte/react) based service shop?

At least removing the generic boiler plate and adding a bit more focus on backend engineering services, game development, ai tooling, ect...

Expected behavior A clear and concise description of what you expected to happen.

We would want the service page to look more modern and sleek, just enough to keep a future client interested. Our main services are:

AI Tooling - ML/LLM Integration Game Development with CI/CD aka Game DevOps BizOps Software Engineering

Screenshots If applicable, add screenshots to help explain your problem.

No screenshots as of right now, but I can update this with some example links once I find some.

Additional context Add any other context about the problem here.

I will add more information as I find it.

h0lybyte commented 3 months ago

Exact Location of the File: https://github.com/KBVE/kbve/blob/main/apps/kbve.com/src/pages/services.astro

h0lybyte commented 3 months ago

Example of the Bento Grid: https://ui.aceternity.com/components/bento-grid

Full example of a service page : https://proactiv-aceternity.vercel.app

dladeira commented 3 months ago

Add Figma live prototype link for KBVE project

Live Prototype: Figma

dladeira commented 2 months ago

Possible concepts for the benefit component

1 image

2 image

3 image

4 image

5 image

h0lybyte commented 2 months ago

The animation jsons are like 30kb average, so I definitely think we should use those. As for the background image, they are a bit heavy, maybe we could layer a darker opacity over them and drop their quality down. I will try that now.

dladeira commented 2 months ago

As for image size, that shouldn't be a problem. We can always render lower quality images first as placeholders, and then fill them in with higher quality images after the first content hydration.

Two more possible designs, without and with background, larger svg, larger title, and less colors

6

image

7

image

h0lybyte commented 2 months ago

6 / 7 looks great, we can just pass along a boolean for the background image?

If enableBackground = true , then we do 7 or if = false, we do 6.

dladeira commented 2 months ago

We could. Should I start building it?

h0lybyte commented 2 months ago

We could. Should I start building it?

Did you want to build a new Astro component ? or do you want to build off the proof of concept one?

https://github.com/KBVE/kbve/blob/dev/packages/astropad/src/benefit/services/ServiceBenefitBlock.astro

dladeira commented 2 months ago

I can work off of the proof of concept

h0lybyte commented 2 months ago

I added StyleX as a library, incase you wish to call CSS inside of the TSX files.