search

wizardamigos / new-webpage

https://wizardamigos.com/new-webpage/
0 stars 2 forks source link

Create - Landing Page Ui Concept #21

Open ibrarli opened 6 months ago

ibrarli commented 6 months ago

@todo

ibrarli commented 6 months ago

tasks - 2024.04.30

worklog

feedback

I have included a summary of all of the discussions with Alex in this documentation and noted down all of the important aspects to be included in our next concept design. Next, I will be working on making my own concept and flow for the wizard amigos website.

proposals

ninabreznik commented 6 months ago

@Ibrar-Haidar thanks for the worklog. We are going to be away from computer today so one of us will be able to check it tomorrow. I just noticed hackMD is still locke, so please if you can add permissions to all to be able to see it. Thanks a lot

ibrarli commented 6 months ago

tasks - 2024.05.05

worklog

worklog-13

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.6

first

  1. learn/use coding skills + create/maintain projects
  2. magical nomadism
  3. healthy lifestyle
  4. activist wizard community

These are our main 4 categories for what the game content is about. I do think everything described in a "proposal" should attach and explain how it supports the above 4 categories and i have difficulty seeing that and wonder if changing things a bit or maybe a lot can improve this

second

  1. transportation/portals are mentioned but the game mechanics and how it all works is not well described, just that it is...
  2. gear/equipment is mentioned but it is more like a shop experience ... It is more meant more as a "club house" where wizards store gear and who needs it borrows it or picks it up and leaves what they dont need. selling/buying will be possible, but that is secondary.

There will be real "shops" in the game for sure, but that is when wizards explore the game in later stages. So when a player starts out, they can visit the "wizard magic stall" and maybe pick up some items for free or exchange items, because their "omni bag" and character equipment slots might have limited capacity, so wizards have to choose.

Think of it as "nomadic lifestyle" (so wizards cant take everything with them)

third

This is the list of "actions" or "activities" of the game when playing a wizard character:

I do see half of them covered, but not in great detail and not how they relate to other parts.

I don't see the other (second) half mentioned much, leave alone described in detail.

fourth

A few items mentioned are: magical book time lens / time orb realm ring

We might need additional items which represent or are important in the context of some of the actions/activities ...and we need details about them.

Those items are equiped or maybe stored in the omni bag after picking up the omni bag from the magica wizard stall, etc..

additional thoughts:

  1. The wizard world should probably not use any floating islands.
  2. The wizard world is a magical strange world
  3. The wizards can use the realm ring and portals to enter the world of floating island in playproject, but thats a detail because there are many other worlds and we want to focus on the wizard world for now and the game
  4. The world needs to blend elements of the perspective of a "first person shooter" (so the player is in the camera) and has menus and buttons and inventories they can open
    • but the wizard character also can be customized, so in that mode the player should see the wizard
    • also in the "ego perspective" (player is the camera), maybe there is still a little representation of the avatar with stats next to it?
  5. learning details about items/worlds/game features, is necessary also later in the game, so it shouldnt be just merged with character creation

...there will always be news about the world, so maybe we need to be able to subscribe to news as well? will that pop up in the quest book? is there magic news? does it need an item? for now we would just use it to explain the game and the history a bit and it's past news about the wizard world... maybe the description of the "magical book" could work...maybe we should name it differently?

Otherwise, i think items and some important objects or elements of the game world need to be worked on ...and then we somehow need to see how the rest of the game world looks

ibrarli commented 6 months ago

tasks - 2024.05.06

worklog

worklog-14

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.07

great. i think what you have is not bad.

It is all text and conceptual at the moment. Everything can be realized in very different ways in a website though.

If every bullet point, section or headline or what have you, would include a list of links to pinterest items that would be a good next step in my opinion.

Maybe split in 2 separate lists:

  1. with links from the moodboard pinterest boad to share what style or things would be used (together with a short description how.
  2. with links from the second pinterst board we made in the end with lots of images that contain ideas to represent certain parts or features of the game, each link together with a short description what part of the image would be used in which way
ibrarli commented 6 months ago

tasks - 2024.05.06

worklog

worklog-15

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.07

worklog

feedback

I have worked on third part of the feedback. It is still on progress.

proposals

serapath commented 6 months ago

feedback 2024.05.08

Went through it, and it sounds good. I guess thinking things through takes some time, so what can we do. It is what it is :-)

Otherwise:

  1. AVATAR +1 (for images and description/relation)
  2. STUDY +1 (for images and description/relation)
  3. QUEST +1 (for images and description/relation)
  4. BOND +1 (for images and description/relation)
    • what is written so far is true as well, so +1 :-)
    • ...but BOND also happens during special organized events
    • e.g. such as events organized in the past:
      • (meetup/codecamps/...)
  5. EXPLORE +1 (for images and description/relation)
    • one thing, exploration usually/mostly still happens as a side effect of QUESTING, but sometimes also to find new QUESTS
  6. GEAR
    • what is written is ok, but we have 2 types of gear
      1. more "physical gear" (omni bag, time orb/lens, realm ring, ...) => equiped on the body
      2. more "mental/mind gear". Those are virtual and one can store a lot more. virtual/digital gear only visible with the "mind's eye". those are crafted using magic, mostly spells or artifacts to have effects. the "time orb" is maybe something like that and using it opens the digital timeline component to subscribe to e.g. events. Only a limited amount of those can be bound to hot keys to activate and probably some space needs to be reserved in the "UI interface" to show them as "quick draw/actions" or something like that.
  7. DREAM +1 (for description/relation)
    • yes, a dream is a bit like making a wish, creating a "QUEST" for the old wizard to help, but it is not well defined and probably needs some help for an older wizard to recognize and help. The old wizard might not get any experience points for solving such a quest, but an older wizard might gain community reputation and things like that, so their social status goes up and maybe that is another way of a more experienced wizard to strengthen their magical abilities in the wizard world
  8. CRAFT
    • this was meant as opposed to FORGE, as "crafting spells" or vitual/digital magical mind gadgets. FORGING would be to actually really craft physical devices and is a bit of a different beast, that requires the right kind of gear/equipment to even be able to do it. But it is correct that studying is unlocking these abilities. It requires almost no special equipment to start crafting, other than studying and some basic ingredients widely available... while forging requires way more serious equipment and is likely only possible in a collaborative effort where others help or otherwise requires a seriously advanced wizard with really a lot of magical gear and equipment to pull off
    • IMAGES: the images chosen work to some degree, but they might also better fit into FORGING. ..."herbs" for a potion is something that is probably basic enough to be covered by CRAFTING, but still... a magical spell or scroll or written book or some sort of magical holograms representing those spells that can maybe be activated with magical gestures which unleash effects from the hologram that shows through a crystal for example... the more digital/virtual nature is missing. In a normal world, where a "crystal" is a "smartphone", those "magical hologram artifacts" are probably "apps" :-)
  9. SHARE
    • Sharing is also meant with "sharing items" and crafted "spells" and "skills", mainly items and ingredients though.
    • Because everyone is a nomad, there are some sort of "library of things" magical places where wizards drop off items and information and others can discover it and pick it up. Some sort of magical reputation or karma will balance these out.
    • Nomads anyway sometimes dont have use for older items and also limited space to carry things. Dropping things is always possible, but delivering them into a "magical library of things" will maybe give the wizard some social status
  10. FORGE
    • Misunderstanding: as mentioned earlier, this is for serious forging of items. aliances/bonds/friendships fall under BONDING. The content here should be moved under BONDING and we need to re-do this one :-)
    • Basically: imagine cooking a meal, writing a letter, coming up with a marketing strategy, designing a wireframe, building a small shelve for books, etc... is possible a CRAFTING ...but: e.g. creating a laptop, building a house, making some sort of "iron man" suit is definitely not something one person alone can easily do alone. It requires serious equipment, skills and collaboration among wizards.
    • => FORGING is meant for when many skilled wizards, all with some more serious equipment, need to collaborate ...bit like supply chains in an economy over a longer time ...to FORGE items once or even multiple times. Maybe they gonna make it a "magical business" :D
  11. SUMMON
    • Misunderstanding: Summoning is meant to summon ANY change to the world, small or big. It can include summoning a creature, but it can involved changing the landscape, adding new game realms or dimensions ...or establishing a new FORGING option. While FORGING is just FORGING stuff that is already known, e.g. "forging a flying wizard zepplin" if such a thing is already known, then "SUMMONING" is creating small or even epic adventures. It involves creating a lot of QUESTS for others to join to help in research or collection of magical resources or experimenting combining different forged wizard machineries to unlock entirely new "supply chains" to conjour new magical "goods/services" ...It summons something new out of nothing and needs a lot of mighty wizards with a vision of what to summon and it requires to channel a lot of mana as well :-)
    • if you think there is a better magical term for this than "summoning", please share :-)
ibrarli commented 6 months ago

tasks - 2024.05.09

worklog

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.09

Maybe rather than merging, we should move it all into github repo, maybe we add a folder SPEC for "specification" and move every part (sections of the very long hackmd) and the new one you made, into it's distinct markdown files under /SPEC/... and update the README.md with a concise overview, by omitting the details and having more of a summary and outline and then linking to those different markdown files under /SPEC/... for more details about a specific aspect.

For Example, the outline you made in the old hackmd could be part of the overview/summary in the main README.md, but it depends what will help us structure the game concept with all it's different features and parts in ways that will help us turning them into an integrated concept for our website, that is an interactive poster, which in a way is also a "teaser" for the game, where landing page visitors can technically already start the first steps, but apart from some demo functionality, most of the game parts are currently ...depends on how we tell the story... currently unavailable or out of order or locked or shrouded in lengeds and mystery and hence unclear how to activate, etc...

one additional thought about in-game "news". the news are probably also delivered to some sort of magical item/artifact ... e.g. "whisper stone" or "crystal ball" or "crystal stone"? "whisper ball"?

one more thing is, we need a "diary", because the game will be about journaling for everything on your quest and that is important, because the diary allows you to look up things from the past and use it for future quests. the wizard diary. ...in fact, the there will be scripting (let's say spell scroll writing) and the language is called "data journalling script" :-) ...anyway, lets continue.

+1 for the "starlight amulet", in fact, maybe this amulet should power all the other magical artifacts and if the starlight amulet is disabled, it shuts down all the other artifacts as well. ...something to consider.

+1 whispering cloak, definitely something we should include :-)

+1 crystal wand, like that idea as well

+1 celestial compass. cool cool, lets keep that as well.

celestial compass, crystal wand, whispering cloak, realm ring, ...should all NOT be available from the limited game demo which is the interactive landing page poster, but they can be described or mentioned in some contexts.

omni bag, spellbook, diary, starlight amulet and time lens or "time orb" and the "whisper stone"/"crystal ball", might become available in the landing page. ...maybe described, maybe ready to be picked up ... etc...

ibrarli commented 6 months ago

tasks - 2024.05.10

worklog

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.10

Summary

First thing to notice is that the README.md isn't a summary in the sense i imagined. The audience is not potential players, but developers or rather us as "game designers". It is meant to be more of an overview - like a "cheat sheet" somebody might prepare for an exam. The "cheat sheet" doesn't mean anything to somebody not familiar with the content, but for somebody who is familiar with the content, the "cheat sheet" nicely summarizes or basically gives reminders about every part of the game in the most concise form possible.

Every part of the "cheat sheet" can be a link though to lead to a document under /SPEC/... which will then give more details to fill the concepts with life :-)

Maybe an even better expression than "cheat sheet" is "rules of a board game". In our case, what does a user see, what can they scroll/click/drag/hover/touch/etc... how can they interact to cause which activities, modes, changes, etc...

Playing a game feels nice and immerses in the story, but describing the formal rules is a bit more dry and dull, but super important to be able to play or in our case to be able to make the landing page game :-) What is just visuals (or even sound) to create the right ambience, atmosphere, vibe, ... and what is hard game mechanics, that technically work without any visuals (just nobody would play because it would look too boring) :-)

Important Points

I do think we can at some point delete "important points" once they are included in the game and our common understanding. Until then, they can live in the footer of the main summary document, the README.md

And we will slowly take care all of that is included in the actual documents which express how the game would work, which is when we can get rid of the important points :-)

Wizard Character Gameplay Elements

This document is good for now.

One thing for this but also in general all documents, when you go to pinterest and right click the image and select "open image in new tab", you can copy the image URL and embed it in markdown directly, e.g.

1. [<img width="25%" alt="description of image" src="https://link/to.jpg">](https://pinterest.com/link/to/image)

2. [<img width="25%" alt="zen meditation" src="https://i.pinimg.com/564x/84/43/22/844322eef8694e9cb6a9382d87d84c73.jpg">](https://www.pinterest.co.uk/pin/539798705352333860/)

3. zen meditation

This document is mostly a check or test for when we have all aspects and visuals and everything of the game for the landing page, we then use it to double check if:

...is all well represented. I can already see, that the "creating projects" part of my original feedback got "lost in translation" :D

Introduction to the game.md#introduction

First paragraph Introduction should probably be in the readme table of content overview and it links to introduction to the game.md (like it already does in a way)

Introduction to the game.md#Introduction to the game

This is great, but it has:

In fact, "we" as the developers will be presented as players in the game as well, hence the distinction between game developers and game players is blurred. (on purpose!)

In Summary:

=> it has overlap with all of them. Let's try to merge those all into one. Maybe we rather need one Markdown Document for each of those words to specify all the details and relations to other parts of each of them.

List of Items

Now maybe it is even worth to make a folder /SPEC/items/... for a separate document per icon and include the picture links for each of them and then link to those markdown files from other parts of the game to express relations (like a "glossary" or "wiki")

Transportation options

:100:

This document is ok, but maybe it should be instead turned into magic item documents for each of the artifacts and then we describe those and if we figure out we dont need all of them, we drop some of the items and we explain the entire aspect of the game which is transportation through describing the items and then mentioning those in other documents using just the word and linking to the item documents

ibrarli commented 6 months ago

tasks - 2024.05.12

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.13

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.14

worklog

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.14

Above seems fine. The SPEC/... folder still contains many documents.

In the last sections of my previous feedback https://github.com/wizardamigos/new-webpage/issues/21#issuecomment-2104816464 i mentioned we could look into summarizing and merging some documents.

Same goes for the README.md

which i think should be merged with the

We can keep the name "Game Flow" as the title, but e.g.:

Basically: I did list all bullet points of AVATAR and Character Creaiton under `AVATAR (Character creation/modification)

The bullet points now even express things redundantly, so we can merge things.

Additionally, we can add the sections like you did in the past and add relations with other parts, description, example to it... and so on. Also, we could add one or more images next to it to show what or how this could be approached. We would take those from pinterest

BUT EVEN THIS IS TOO MUCH FOR THE README :-)

So after doing that of course, we should have the README just with the list of titles, e.g.:

Looking at the README and https://github.com/Ibrar-Haidar/new-webpage/blob/main/SPEC/introduction%20to%20the%20game.md

... etc ... and maybe we have to add:

And make all those title bullet points links to:

Flow Chart

I tried to think about the flow chart, but i feel that it is misleading. It gives the impression the game is a linear progression of steps, but that's now how it is meant to work, so i would rather get rid of the flow chart (not of the content though)

above is the "flow chart" restructured to include all elements of it in those key words

It's now 13 instead of 11, because we added "GAMEHUB" and we added "NEWS".

ibrarli commented 6 months ago

tasks - 2024.05.15

worklog

feedback

proposals

serapath commented 6 months ago

feedback 2024.05.16

First, a bit shocking how much time this takes. Let me know maybe upfront how long you think the next one might take, so we can adjust how to work on stuff to not take so very long.

I was hoping to literally just cut & paste the "magic items" text and images from the markdown document into their own items/<item-name>.md documents which is now done. great.

I was hoping the same would happent with the "game flow" steps into flow/<step-name>.md which is not done.

I was hoping the documents we dont need anymore, because they have been moved into their own files or merged with other files (e.g. important points being part of the README now), that we can get rid (=delete) those not important files anymore, which includes the "flow chart.md" once we have the flow/... folder with the step markdown files.

Finally - maybe you aren't so experienced in that type of work yet, which of course is okay - it's currently not yet "figma design", but all of that work, should have probably taken 30 minutes in total, maybe even including the worklog logging time (and if something was not clear you could ask before starting the work)

... I'm sorry for not asking before, so please let me know how much time you estimate to complete the task described here and previously, because if you think it would take more than 1 hour, then i would just quickly make a pull request and do the changes myself so we can continue with the next steps, which is hopefully closer to figma, where i remember we made quite some progress in much less time.

cheers

ibrarli commented 6 months ago

tasks - 2024.05.19

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.19

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.20

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.20

worklog

feedback

proposals

ibrarli commented 6 months ago

tasks - 2024.05.21

worklog

feedback

proposals

serapath commented 5 months ago

feedback 2024.05.27

it seems good to me. thanks. now we have quite some content:

  1. a bunch of flow steps
  2. a bunch of magic items
  3. the "gameplay elements" as the main game topics
  4. a bit about transportation/portals

And we now have a first draft of the landing page.

Reading through the landing page, i don't yet know how all the things mentioned in (1.,2.,3. & 4.) would fit into it. Nothing is linked, but we are also still working on it :-)

My main thought about "landingpage" is, that the first two sections (intro & avatar) should also still be reachable later on, e.g. to check the intor again or to later in the game check the intro for something additional. Same with avatar - it should later on be possible to open and edit/change your avatar. Thus both (intro and avatar) should be integrated in a way that works at any time.

Hence I imagine it would be smart to start in figma with the main interface/game hub and then slowly extend/integrate everything else from here, including (avatar/intro) ...just that when somebody comes for the first time to the page, they would maybe start with that section/menu/element already open or focused by default.

ibrarli commented 5 months ago

tasks - 2024.05.27

worklog

feedback

proposals

serapath commented 5 months ago

feedback 2024.05.28

It is an interesting idea. I am not sure what you mean by "design main interface UI". It seems it only writes "Quest" and has a zoom-in/zoom-out button, but the rest is a story how it could work and it is quite bound to that particular image.

I do think we need to separate the main interface UI from the world or background image, because we anyway switch scenery by using portals and moving around, so the main menu and inventory shouldn't be bound to the scenery.

A particular scenery could of course be interactive and we do something there, and this picture could be an example of one such scenery, but what i do feel is missing is the functional part.

Basically according to the design principle: "form follows function", where form is the design and shape and style, but the function is, what is the use of an element. why do we need it. what does it do? what is it's purpose?

Think of it like this: ... for every flow element and/or item, ...or maybe even better, start with the Wizard Character Gameplay Elements.md

What we need is some thinking about a game interface that covers all these parts without embedding them into the scenery.

If you live in a home, a house, you can put all your stuff into your shelves and rooms, but if you are a nomad, you have them all with you at all times and... we need ways to acces quick actions or items and ways to explore our inventory, customize, etc...

The pinterest board had some ideas about menus which you can use for inspiration.