A Set

Business problem

At CodeYourFuture, trainees build many front ends, sample websites, and
layouts as we learn web focused software development.

We use stock imagery sites, like Pexels, Unsplash, Pixabay, and other
royalty free stock image sites, to find photographs, icons,
illustrations, and other graphic assets.

But we also create lots of assets and we don’t have a way to share them
with other members of our organisation.

How can trainees discover and use these assets in an organised way?

Proposed functionality

User accounts
A way to upload assets
- How do we make sure we have the rights to these assets?
- Should anyone be allowed to upload?
A way to discover assets
- Can assets be described with keywords or tags?
- Should they be organised into categories or folders?
- What sort of categories? Does image size matter? Type?
A way to use assets
- Can we provide an API as we know trainees will be building lots
  of front ends?
- Do we need bandwidth limits?
- How do we protect our images so they are not used by other
  people?

These assets should be stored in a PostGreSQL database and displayed by
a React front end.

Users and roles

As a trainee, I want to quickly grab images and assets that represent me
and my community.

As a mentor, I want to quickly grab images and assets that represent me
and my community.

As a mentor, I want a go-to place to pull assets from to brand my CYF
projects and tutorials instead of making them myself every time.

As a staff member, I want everyone to use assets that we have the rights
to use.

Stretch goals

User collections
- A user can collect assets into a themed collection they can
  share with others
On the fly API
- Collections are also available as JSON so users can consume the
  images in their own application.

All Eyes On Me (DevOps, QE)

Business problem

At Code Your Future, trainees open pull requests to coursework repo
every week. Mentors work really hard to review PRs when they can, but a
lot of time is wasted on getting the basics right: PR message filled in,
acceptance criteria met, linting enabled, that often mentors run out of
time before they can get to more substantive commentary. Trainees don't
get as much feedback as they really need.

How can trainees get automated feedback on the basics?

Proposed functionality

A way to define basic PR quality standards
- How will you set these? There are some notes in this briefing on
  typical mistakes CYF trainees make on every repo..
A way to test each PR
- Github Actions can be run on PR. What existing automated testing
  exists in the repositories and how are they different across
  modules?
A way to reject each PR
- We want to know which PRs are ready for human review, so how
  will you reject PRs that need more work before they can be
  looked at?
A way to share the standards
- Actions can be published to a marketplace or stored at an org
  level. What will you choose?

Your solution/s should be available to everyone at CYF and be modifiable
by mentors.

Users and roles

As a trainee at Code Your Future, I want help with making my PRs meet
professional standards.

As a mentor at CYF, I want to make sure every trainee gets some
feedback so they become the best they can be.

As a module lead, I want to get automated reports of trainee PR quality
across a whole module or all of CYF (but this is a stretch goal)

What else do users want? How will you find out? Some user research may
be needed. Remember: Do the simplest thing that could possibly
work.

Stretch goals

Reporting
- Automated and aggregated reporting to show us patterns over time

Things to consider

Here are all the repos trainees open PRs to
https://github.com/CodeYourFuture/Table-of-Contents

There are existing tests running on some repos at CYF. Can your solution
work with those tests? Make sure you don't disable existing, working
solutions.

One approach to testing PRs is to write all the coursework answers in a
file and check the PR code for them. Why is this not desirable? Another
approach is to fix the errors for the contributor. Why is this not
desirable? (Remember, at CYF the goal is to learn.)

Errors common to all CYF trainees in all weeks

Terrible communication

A single giant commit with no descriptive messages
PR message template not completed and nothing explained to or asked
of reviewer
PR not titled as asked but something like "final" or "my work"

Junk changes

Junk files in the PR from using git add . (node modules, DStore,
etc)
Old work from previous weeks in the PR
Formatting - not having Prettier installed
Loads of commented out code left in the files

Empty PR

There's basically nothing in the PR but it's not opened as draft

Appanage

Business problem

At Code Your Future, we build loads and loads of team projects. We
invent products, build apps and solve problems together. We use many
products built by CYFers: the
Dashboard,
Classplanner,
the Curricula,
Signposts,
Rainbird, and many more were all built in-house and some as "final"
projects.

We have a great time and learn a lot, but good work is often lost
because nobody maintains the product after the build is done. We still
need a working attendance system, even though we've built several, and
everyone wants one.

It should go like this:

💡Idea ➡ 🧪CYF Labs ➡ 🎁CYF Products

Experimental products implicitly belong to CYF Labs. Once they have been
trialled and proven, they can be proposed to CYF Products, and if
there's a team and a solid use case, they will be accepted.

But most CYFers don't know this. So, how can CYF volunteers discover
and adopt products CYF needs?

Proposed functionality

A way to produce listings of available products
- What schema will you use or
  define to describe available repositories?
- What information do CYFers need to understand how to adopt a
  build?
A way to organise participation
- How will people sign up to adopt a build?
- All these products should be Open Source; how will you also
  open up contributions from the broader FOSS community?
- How will you empower CYFers to support specific products they
  want?

What is the simplest thing that can possibly work?

These product listings should be stored in a database and displayed by a
front end which scores 100 for Accessibility on Lighthouse. You should
produce a public unauthenticated API.

Users and roles

As a trainee, I want to develop my skills to help me get on to a CYF
Products team when I'm ready

As a developer, I want to sign up to build things for real users to
keep me motivated in my coding

As a mentor, I want to scan open listings and get a sense of the
current builds and what I can help with

As a staff member, I want everyone to feel empowered to participate
in the universe of CYF Products so I don't personally die of exhaustion
trying to organise it all

Stretch goals

Slack feed
- Should new products be posted to Slack? Will you create a
  webhook?
Product space similarity vector
- There are often multiple takes on the same problem. Can you
  group products by similarity?

Things to consider:

Why aren't products adopted? There are many reasons, and not all of
them can be solved. What happens in between the build and take-up?
Understanding this gap will help you build something that can bridge it.

Is it desirable for every product to be adopted? Why or why not?

How can the Change Board help you?
https://github.com/CodeYourFuture/Changes

Useful links

https://docs.codeyourfuture.io/trainees/cyf-products
https://www.gov.uk/guidance/the-technology-code-of-practice

Avanart (FE, UX)

Business problem

At Code Your Future, we interact on many different platforms: GitHub,
LinkedIn, Slack, Codewars, and more. We all choose a single, consistent,
avatar, so we can recognise each other in all these different contexts.

But not everybody can share a picture of themselves online in our
community, so many people use
Robohash to generate a unique
robot avatar from their name.

We want our own CYF-flavoured robohash!

Proposed functionality

A way to generate avatars
- Robohash is open source
  https://github.com/e1ven/Robohash
A way to search avatars?
- How will full-text search work on your product? Will you build
  it yourself or use services like Algolia or Lunr? What are the
  advantages and disadvantages of these?
A way to share avatars

These avatars should be generated and displayed by a front end which
scores 100 for Accessibility on Lighthouse. You can choose the framework
or build in native web components.

Users and roles

As a trainee at Code Your Future, I want to get a personal avatar so
everyone can recognise me

As a mentor, I want a CYF-branded avatar system so I can easily
recognise CYFers online and say hi

What else do users want? How will you find out? Some user research may
be needed.

Stretch goals

Regional avatars
- In North West, the different cities have different symbols:
  Manchester are bees, Leeds are owls, Liverpool are liver birds
  (cormorants), and Sheffield are smiths (Thor and Vulcan). Can
  you find a way to create regional avatars that incorporate these
  symbols? Can Boring
  Avatars help you?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Gravatar Integration
- Can you design a user flow to
  https://en.gravatar.com/
  to share the avatar on many services at once?

Important Note to Developers: This project could be highly
challenging or could be a fairly simple implementation of an existing
library. The real skill here is to start with the simplest thing that
could possibly work.

If the groundwork is solid, this project could be adopted by CYF Labs,
so get the fundamentals right first.

🖼️

{width=“1.2083333333333333in”
height=“1.2083333333333333in”}

🖼️

{width=“1.2083333333333333in”
height=“1.2083333333333333in”}(current NW avatars for inspiration)

Badger Badger (DevOps)

🦡 🦡 🦡 🍄

Business problem

At Code Your Future we have a bunch of great Open Source products, but
they're not all in the greatest shape they could be. To really shine, our FOSS repos should meet the highest standards of https://www.bestpractices.dev. But to do this, we need a team of developers to understand the
criteria, plan the changes, drive the adoption, and support all technical contributors to meet the new standards.

This highly challenging project is only suitable for advanced trainees or grads doing a specialisation track.

Proposed functionality

At least one CYF FOSS project should meet the requirements for a passing level Badge https://www.bestpractices.dev/en/criteria/0

Users and roles

As a FOSS maintainer I want my project to be well-run and of good quality

As a CYF organiser, I want to attract talented developers to volunteer with us

As a CYF trainee, grad, or volunteer I want to contribute to impressive codebases and raise my profile

As a CYF DevOps track trainee, I want to gain practical experience in creating a culture of excellence in an organisation

As the Director of Education, I want to share our work and have properly represent the talents and achievements of our community

Likely challenges

There are over 600 repos in CYF, and you can’t do them all. I suggest you start small. Do the simplest thing that could possibly work.

Stretch goals

Silver, or Gold!

Careless Whisper

Business problem

At Code Your Future, mentors and trainees hold many study sessions.
Often people record these sessions, which is very helpful.

But not everybody can learn or absorb from video teaching. Some people
really need a transcript. (Others desperately need a summary. )

How can trainees use
Whisper to transcribe
study sessions? How can they discover and browse those transcripts in an
organised way? And could they even summarise those texts? How?! What is
the simplest thing that could possibly work?

Proposed functionality

A way to use Whisper
- How will you teach users to do this? Will you write a
  tutorial page? Embed a video? Your users are all developers;
  how does this affect your decision?
- Are there free online services users can extract their
  transcripts with?
A way to upload transcripts
A way to search transcripts
- How will full-text search work on your product? Will you build
  it yourself or use services like Algolia or Lunr? What are the
  advantages and disadvantages of these?
A way to browse transcripts
- What metadata will users need? A link to the original video?
  A link to the module on the syllabus? What about repos on
  Github? Cohort name? Date? Keywords? Summaries?
- How will users find the most useful transcripts? A voting
  system? Or what about most downloaded or most returned-to?

These transcripts and summaries should be stored in a PostGreSQL
database and displayed by a React front end which scores 100 for
Accessibility on Lighthouse.

Users and roles

As a trainee at Code Your Future, I want to get targeted mentorship on
the coursework I am completing.

As a trainee who reads better than they hear, I want transcripts of
everything.

As a trainee who has four kids and two jobs, I want a summary because I
don’t have two hours to watch a video.

As a mentor at CYF, I want as many trainees as possible to be able to
access the study sessions I run.

What else do users want? How will you find out? Some user research may
be needed.

Stretch goals

Video upload
- For teams with a Systems track developer, can you build A/V
  upload and process with Whisper in the cloud? What open
  source
  examples
  exist that you can use to help you?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Summarise AI

You’ve taught the community to transcribe using one AI model. Can you
teach them to use a summarise model? Which of the 700+ public
models
could you use? Teams with a PM, Product Owner, and Tech Lead should
workshop and roadmap this feature, even if you don’t build it.

Important Note to Developers: This project could be highly
challenging or could be a fairly simple text search and filter view. The
real skill here is to start with the simplest thing that could
possibly work.

If the groundwork is solid, this project could be adopted by CYF Labs,
so get the fundamentals right first.

Clarissa Explains It All

Business problem

At Code Your Future, Sally explains things. She actually cannot be
stopped.

Of course we all have Google and can look things up ourselves. But in
programming, for every problem, there are many right answers. What
CYFers want to know is: which right answer have we agreed to use?

In collaborative software development, the most important thing is that
everybody agrees on the rules of the road. Much like traffic laws, it’s
not that driving on the left or right is better or worse, it’s that
everybody must agree or we will drive into each other.

How can developers build a knowledge base of answers?

Proposed functionality

A way to ask questions
- What interface will you build to help the user interact with the
  model? Do the simplest thing that could possibly work.
A way to rate answers
- You’ll want to improve your model by flagging bad answers.
- Who decides bad answers? Do admins and users have different
  levels of authority here?

The application should store data and display an interface which scores
100 for Accessibility on Lighthouse.

Users and roles

As a trainee at Code Your Future, I want to find out simple quick
answers to my questions without reading a zillion docs.

As a mentor, I want to improve processes without creating a burden for
others or a constant backlog of outdated docs..

What else do users want? How will you find out? Some user research may
be needed.

Your CYF model will be supplied as a hosted model on huggingface but
please give notice so CYF can prepare this for you.

Stretch goals

Fine tune

Can you create a way to update information by fine tuning with new
facts?

Slack bot
- Can you create a Slack bot to bring the question and answer
  interface into Slack?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

[Note: this challenging project should only be attempted by a strong
group of developers who have a tech lead familiar with machine
learning.]{.mark}

Deja Review

Business problem

At Code Your Future, we like to use a learning technique called spaced
repetition.
In fact it is set as prep work several
times
during
the
course.
The technique involves reviewing a topic over increasing time gaps (e.g.
after one week, one month, three months, six months, one year).

What is the simplest thing that could possibly work?

Proposed functionality

A trainee can add the name of a topic and the date on which they
first learned it
The system then calculates the dates on which they should review
The computed dates could be stored in the browser and displayed when
the trainee revisits the website

Users and roles

As a trainee, I want to easily calculate the dates when I should be
reviewing a newly learned topic.

As a trainee, I want to know which topics I should be reviewing so
that I can plan it.

Stretch goals

Integrate with Google Calendar / iCal / Outlook to allow future
review dates to be added my calendar and notified about them

Things to consider

Leaning into browser storage seems like a good way to avoid building an
auth system (which is a difficult challenge of its own).

Deskeando

Business problem

Who will work where, and when?

At HaveALook Multicorp, there are 50 desks in the office, but no way of
organising who will work where. People may work alone, in pairs, or
in larger teams, and these groupings change all the time. Sometimes
there are Covid restrictions on how many people can be in the office and
those change often too.

They need an application to manage this problem, a way to book desks in
advance so everyone can be sure they have space to work.

Proposed functionality

A user account for each office worker.
A way to see what desks are available
A way to navigate a calendar of availability.
A way to see the features of different desks.
A way to book a desk for yourself.
A way to book desks for others in your team.
A reminder of an upcoming booking
A way to cancel a booking.

The database of bookings should be stored in a PostGreSQL database and
displayed by a React front end.

Users and roles

There are developed personas for this project:

https://www.figma.com/file/4bit1t0X7VZB7XFCysGIhV/CYF-Project-Team-7?node-id=0%3A1

Please develop your user stories based on these.

Challenges

You will need to integrate a visual map - probably in SVG. You will have
to make sure your SVG is accessible by keyboard and screenreader. How
will you test this?

Most users will access the booking application on their phone, so your
design should be “mobile first”.. How will you make the design flexible
and flowing so it also works on desktop?

Stretch goals

SMS notification
- A user can cancel a booking directly from a reminder text
User Testing
- Recruit a group of users and run UX testing

Further resources

Draft of proposed Featureset

Main screen (X week view)

show all bookings for upcoming X week time period
- As an employee I would like to see all bookings for the
  upcoming time period so that I can choose my days to book with
  maximum information
show number of available desks for each day
- As an employee who makes bookings for my team I would like to
  know for each day how many desks are available so I
  immediately avoid days with too few availabilities
show bookings for no specific desk
- As an employee I would like my booking to be visible so that
  other employees can know I’m in and choose to come in on the
  same day so we can get lunch
show bookings for specific desks clustered in a way that makes taken
and empty clusters visible
- As an employee who makes bookings for my team I would like to
  know for each day whether there seem to be any clusters
  available so that I immediately avoid days with no desk
  clusters available
- As an employee who makes bookings for my team I would like to
  have visual confirmation that my booking is for a cluster so I
  know that I didn’t make any mistakes
options to navigate to future and past
Make booking for day
- As an employee making a booking I would like to select a date
  and get taken to a booking screen with reasonable defaults so
  that I can click ok and move on with my life
Make booking for day/desk?
Cancel booking for day/person
Edit booking

Booking screen view

Select date
- Date is preselected
- Date can be changed
- Date recurrence can be selected
- Date range can be selected
Enter name
- Single name is by default the logged in name (no login to start)
- Names have a dropdown/autocomplete of known employees
- Until we have logged in employees (not in the first increments),
  assume we have a pre-populated table of of employees from which
  names of people being booked will be logged in
  - Once we have login, can figure out what we do with
    not-yet-registered employees (or not-ever-going-to-be
    employees)
Don’t care where I sit
- By default
Choose morning only/afternoon only
- by default don’t need to do either
Floor plan appears and can select desk (note: developers should ask
questions about this)
- Floor plan shows desks that are already booked
Confirm button

Notifications

View big floor plan

Floorplan

🖼️
{width=“6.5in” height=“6.791666666666667in”}

Development Planner

Business problem

At CodeYourFuture, we work through a defined syllabus and our coursework
is set by teachers and subject matter experts.

After we graduate, we need to take control of our professional
development and plan our own learning schedule.

Proposed functionality

The app should have user accounts and all plans should default to
private

Users can invite feedback on their private plans with a share link

Goals can be scheduled and tasks prompted by a notification system

All data should be stored in a database and be accessed by API

Users and roles

[As a graduate, I want to create a professional development plan with
defined and scheduled SMART goals.]{.mark}

[As a job applicant, I want to create a role focused development plan
to prepare for a specific job opportunity.]{.mark}

[As a mentor, I want to be able to give feedback based on my
professional expertise.]{.mark}

Likely challenges

Be careful how you structure your data as this could get confusing
quickly
How will you send out notifications? With a mailer, or push
notifications?
How will you authenticate? Can you use Github? Should you use
Google?

Existing Systems

Stretch goals

Allow role plans to be published and remixed after they have been
developed
- As a graduate, I want to share the effective development plan
  that helped me get a job
- As a mentor, I want to improve a template development plan in my
  specialism
- As an applicant, I want a framework to begin my own plan
User Research
- Speak to your classmates about what features they’d like to use.
  Select a sensible feature and build it.
- Speak to your teachers and mentors to see what features they’d
  like to use in the app. Select a sensible feature and build it.

Ding! Next! (DX/tooling)

Business problem

At Code Your Future, we run sessions and workshops online with lots of
participants. These workshops usually involve timed segments with
activities, discussion, and presentations. But it can be hard to keep to
time when everyone is so interesting and smart (such a problem for us!)

How can we run our calls with discipline and timeliness so we can get
everything we need to do, done?

Proposed functionality

Agenda Parsing

The extension will read the agenda written in the Google Calendar
description and parse the items and timestamps.

Automated Meeting Chair

The chair could sound a buzzer when the timestamp for the next agenda
item is reached.

It should automatically post the next agenda item in the Google Meet
chat window.

Technology Stack

Frontend: JavaScript for the browser extension
Backend: Google Calendar API for fetching event data, Google
Meet API for interacting with the meeting
Database: None required as it operates in real-time and doesn’t
store data

Users and roles

As a meeting organiser, I want to ensure that the meeting follows the
planned agenda so that it is more efficient.

As a meeting participant, I want to know what each segment of the
meeting is about and when it will happen to stay engaged and contribute
effectively.

What else do users want? How will you find out? Some user research may
be needed. Remember: Do the simplest thing that could possibly
work.

Things to consider

Likely Challenges

Synchronisation between Google Calendar and Google Meet.
Handling various time zones and daylight saving changes.

Stretch Goals

Voice Announcements: The extension could also make voice
announcements for each agenda item.

Customisable Alerts: Allow users to customise the alert sound and
message.

Development Phases

Feasibility Study: Research Google Calendar and Meet APIs to ensure
the project is technically feasible.

MVP Development: Build a basic version of the extension that can
read the agenda and sound a buzzer.

User Testing: Conduct tests with CYF staff and volunteers to gather
feedback.

Iterative Improvement: Implement additional features based on user
feedback and testing.

Deployment: Make the extension publicly available after thorough
testing.

::agenda

10:00 agenda item eg description of activity

10:15 description of next agenda item

.

title: “[]{#_nn86dzvod7qx .anchor}Energise!”

Business problem

At CodeYourFuture, we run lots and lots of meetings, often with people
who don’t know each other well or at all. We begin our meetings with an
energiser - a game to get the group together. But because we have so
many meetings, it can get hard to think of all these energisers and it’s
hard to know which are good.

Proposed functionality

The app should present an energiser from a database of energisers

Energisers can be chosen by name, randomly selected, or sorted by some
metric

Users can vote on the energiser according to some metrics they find
useful (fun/quick/ideal number of participants etc)

All data should be stored in a database and be accessed by API

Users and roles

As a host I want to pull up an energiser suitable for my meeting and
have a good description of how to run it

As an attendee, I want to upvote energisers I like and downvote the
ones I found a bit rubbish

As a creator, I want to upload my energisers in a simple structured
way

Likely challenges

Be careful how you structure your data as this could get confusing
quickly

Stretch goals

Create a slackbot
- As a host I want to to run some energisers (eg voting or
  answers) on a slack post that is posted automatically by the app
User Research
- Speak to your classmates about what features they’d like to use.
  Select a sensible feature and build it.
- Speak to your teachers and mentors to see what features they’d
  like to use in the app. Select a sensible feature and build it.
Dark mode
- As any kind of user, I would like to access dark mode
Host a game (mega stretch)
- As any kind of user, I’d like to play simple games directly in
  the Energise app.

Glossary

Business problem

We introduce a lot of new concepts and technical “nomenclature” to
students during the CYF course. It can be hard to keep track of all of
the different terms that get used, sometimes with different meanings in
different contexts. You can search for a word within the syllabus, but
the output isn’t formatted and it can be hard to figure out which
reference to that word will actually give a good definition.

Proposed functionality

A solution would provide an easy-to-use way to search for a technical
term and get a short definition, along with links to additional
resources (e.g. appropriate section in the syllabus, MDN, …) and
related terms.

Users and roles

The primary users will be students looking for a definition for a
specific term. There will also be students and mentors adding content,
either new terms or new/updated material for existing terms. There may
also be some kind of moderation/administrative role (see below).

Likely challenges

How can we moderate and review the definitions as they’re added, to
ensure that they’re high quality and easily understood by students? How
do we handle common misspellings, or searching for things by symbols?

There can end up being a lot of data in a system like this, how can we
create a system that scales efficiently to deal with that (e.g. showing
“pages” of data)?

Stretch goals

Slack bot: that people can ask for definitions, and will reply
with a snippet and link
History: can we see how the definitions have been changed over
time, and by whom?
Syllabus integration: can we get the definition information from
the syllabus somehow?

Goal!

Business problemh

At CodeYourFuture we use daily standups, goal setting, and design
thinking to continuously evaluate our work and plan improvements, and we
want to teach our trainees this habit too. But right now this means we
have a lot of meetings, where ideas get lost, or that we do a lot of
paperwork and repetitive work, writing out all of these processes. We
don’t want to teach our trainees this!

We want to spend around ten minutes each morning creating our
standup, ten minutes each week setting our weekly goals, and ten minutes
each month - etc.

We want to systematically record our work and then programmatically
create each larger time block of goals from the smaller time block:
quarter from month, month from week, week from day.

This is a challenging problem suitable for advanced trainees.

Proposed functionality

A ToDo app with time settings and Slack bot conversational interface.
The app must integrate with Slack as that is where everyone in our
community is every day, but the app should have a GUI (website) as well.

All data should be stored in a database and be accessed by API.

Users and roles

As a user, I want to spend less time recording my goals

As a user, I want to catch things I’ve missed and keep on top of my
tasks

As a user I want to share my work easily

As a leader, I want to see what my team are working on

Likely challenges

Integrating with Slack means understanding the Slackbot API. Look at
existing standup bots to see how this works.

https://codeyourfuture.slack.com/apps/search?q=standup

How will you manage access to the goals?
How will you manage time and navigating by time? Will you integrate
Google Calendar?

Stretch goals

Suggest items in daily standup
- In the Daily Standup conversational interface, suggest goals
  from the ’to do’ bucket that are not done.
Mark items as done
- On the web app interface, the user can mark items as done and
  assign them to dates even if they were not chosen during the
  daily standup.
Create teams
- Create a role of ’team’ and allow users to share goals with
  their team. This could include auto-posting to a team channel on
  Slack.

Note to Coordinator: This is already a challenging project, but if you
wanted to go further, you could divide this into two teams - one
building the graphical interface and one building the conversational
interface. Managing multiple interfaces with one API is some next
level stuff, so only choose this option if you have an abundance of
very strong performers.

Good PR

Business problem

At Code Your Future, trainees use various tools like GitHub Projects for
issue tracking, Slack for communication, and Google Meet for video
calls. However, there is no centralized platform to visualize everyone'
progress and activity on their final projects.

How can trainees and mentors track project progress, visualize GitHub
activity, and ensure fair contribution from all team members in a
single, purpose-built platform?

What is the simplest thing that could possibly work?

Proposed functionality

Project data integration

Import project data: Team Name, Person, Role, Project Brief, Slack
#channel, GitHub Username, GitHub Repo, GitHub Project Board,
Deployed App, and Presentation

GitHub activity visualization

Display project progress and team member contributions based on
GitHub activity
Generate graphs to visualize project progress and individual
contributions

Fair contribution tracking

Implement a function to calculate and monitor each team member's
contribution percentage.
Show alerts if contributions fall outside the acceptable range,
prompting intervention

Centralized dashboard

Combine data to provide a comprehensive view of project progress and
team collaboration

These features should be supported by a PostGreSQL database and
displayed by a React front end, which scores 100 for Accessibility on
Lighthouse.

Users and roles

As a trainee, I want to track my contribution to the project and
ensure that the team is working together effectively.

As a mentor, I want to monitor project progress and intervene when
necessary to maintain a fair distribution of contributions among
trainees.

As a project manager, I want to visualize the progress of multiple
projects and identify any issues that require attention.

As a participant, I want to see the progress of teams over time..

Stretch goals

Automated alerts

Send notifications to Slack or email when contributions fall outside
the acceptable range
Customizable visualization
Allow users to customize the dashboard, selecting which data and
visualizations are most relevant to their needs

Lighthouse CI

Integrate Lighthouse testing into the deployment workflow
Define GitHub actions and set budgets for Lighthouse scores

Things to consider:

Integrating with existing tools like GitHub requires understanding of
their APIs and data formats. How can you ensure seamless integration
while providing added value through visualization and fair contribution
tracking?

There is already a spreadsheet that tracks this data, and it shows one
way to pull the data you need from GitHub. Can you use this to help you?
[TEMPLATE] Final Project -
Tracker.
The code is in the attached App Script.

Additional APIs and services to explore:

More GitHub APIs for repository, commit, and project board data
Slack API for sending alerts and notifications

[NOTE: a version of this project was built by trainees and adopted by
CYF Products in Q3 2023]{.mark}

Hack Around the Clock

Business problem

At Code Your Future, we join hackathons and have a lot of fun learning
and building together.

But we also find it hard to coordinate and we miss a lot of great
opportunities.

How can we discover and participate in hackathons in an organised
way?

Proposed functionality

A way to consume listings
- How will you consume multiple APIs? Is it better to start with
  one feed and then add a second?
- How will you normalise the data into one standard event listing
  with the details a CYFer cares about?
- What event
  schema
  already exist?
A way to produce listings
- How will you only show events that are still available?
- How will your users sort and filter events to only show the ones
  that are right for them?
A way to organise participation
- How will people sign up for events?
- How will you empower CYFers to organise a group to participate
  in events?

What is the simplest thing that can possibly work?

These events should be stored in a database and displayed by a front end
which scores 100 for Accessibility on Lighthouse.

Users and roles

As a developer , I want to sign up for fun events to keep me
motivated in my coding

As a mentor, I want to scan open listings and get a sense of the
current opportunities

As a staff member, I want everyone to feel empowered to participate
in the universe of coding events themselves, so I don't personally die
of exhaustion trying to organise it all

Stretch goals

Slack feed
- Should new events post to Slack? Will you create a
  webhook?
Filtering events
- Can you filter the events to only things CYFers can
  realistically participate in? For example, how will you discard
  all in-person events in the USA from MLH lists? How will make
  sure everything is free?
Google Calendar

Can you produce a google calendar of events that we can all subscribe
to?

Conferences
- What about free conferences and meetups? Can your app handle
  those too? Should it?

Things to consider:

Most events are hackathons, but not all. How will you decide what to
tell the user about each event?

There are many more events than anyone can or should participate in? How
will you filter events to things we really want to do?

How do event aggregation APIs get their data? What is web scraping?

Who already organises a lot of events at CYF? Would they be a good
person to advise you on your development?

Useful links

How to make a class (UX/FE)

Business problem

At Code Your Future, setting up a new class involves coordinating
various elements like trainees, volunteers, resources, and more. There
is no fun and intuitive way to understand and visualise what goes into
"baking" a successful class.

☀️We like clarity. It's really important to us that everyone
understands what they need to do to start a cohort at CYF.

How can cohort founders explore and experiment with different
conditions to understand their options.

What is the simplest thing that can possibly work?

Proposed functionality

A way to visualise requirements
- Create a web-based game using SVG illustrated game pieces.
- Central mixing bowl where "ingredients" for a class are poured
  in from containers set around the page.
- A "baking" phase where optional elements like food and
  childcare can be added, each having a cost.
A way to experiment with requirements
- Dials and buttons could adjust ratios and tempo.
- How will you set limits but still encourage autonomy?

This fun web game can be written in React, Web Components, or a
framework of your choosing. You do not need to build a login or a
database. The front end must score 100 for Accessibility and over 80 for
Performance on Lighthouse.

Users and roles

As a prospective CYF organiser, I want to understand what elements
are essential for setting up a new class and how they interact.

As a volunteer or staff, I want to express the complexities involved
in forming a new class in an engaging way.

Stretch goals

Live data feed integration
- Nobody can start a new class if the previous cohort is still
  struggling to find work. How will you set a limit by region?
Update constraints and ratios
- As CYF evolves and we learn more about success and failure, we
  update the constraints. How will you allow administrators to
  update the values?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Things to consider:

How can the Change Board help you?
https://github.com/CodeYourFuture/Changes

How can the Programme Team help you?
https://github.com/CodeYourFuture/Programme

This is a serious interface challenge. Get as much help as you can from
UX and FE mentors.

More details:

When to launch ITD > Fundamentals >
SDC

CYF Guide - Launching a
cohort

Understanding Scale at
CYF

—------------------

Notes: 🎂Cake Your Future

What is the recipe to make a class?

🧑 We need how many trainees

🧑 We need how many volunteers

🏢 We need a place to meet

💻 We need laptops

🚌 We need a syllabus to understand what to do

🧑‍🏫 We need training to understand how to do it

Where do trainees come from? ITD => funnel of ITD applicants and change
the completion rate with a dial?

Where do volunteers come from? => meetups, dashboard signups, graduates
=> what is the retention rate on these inflows?

Where do places to meet come from? Volunteer workplaces, company
donations, local government support, community centres

Where do laptops come from? Donations from companies, personal
donations, donated money to buy them

Where does broadband come from? Donations from companies, personal
donations, donated money to buy them.

Where does training come from? Volunteers and staff donate their
experience. Some staff used to be volunteers!

Where does the syllabus come from? FOSS on Github, sister orgs like HYF,
donations from Udemy and Codility, individual contributors

What extras are most impactful? (the icing on the cake)

🍲 food

👶 childcare

🎫 bus tickets

What makes a class even better? (light the candles)

=> hackathons

=> workshops

=> lightning talks

=> games

Hub planner

Business problem

At Code Your Future, volunteers face extra challenges when coordinating remote and hybrid Saturday sessions. In the North West, for example, public transport is not reliable. Trainees could be in Manchester, Leeds or Liverpool. Some trainees may have to attend remotely due to train strikes, cancellations, breakdowns and floods!

Proposed functionality

A way for trainees and volunteers to check travel disruptions in
their region
A way for everyone to register their attendance type
- How can volunteers and trainees record their type of attendance?
  What sort of data will we need to store?
- How can trainees provide a reason for their attendance? Is this
  useful?
- What types of attendance are there? Remote, in person…. What
  else?
A way to notify facilitators of where everyone will be before
class
- How might fellow volunteers or trainees notify others that there
  are travel issues in their hub?
- How will users tell what day everyone is talking about? Will you
  use a calendar?

The attendance type data should be stored in a PostGreSQL database and
displayed by a React front end,

Users and roles

Trainees

As a trainee, I want to check for local travel disruption in my region
before a Saturday class

As a trainee, I want to register my type of attendance ahead of a
Saturday class

As a trainee, I want to be able to quickly update my attendance type
ahead of a Saturday class

Volunteers

As a volunteer, I want to check for local travel disruption in my region
ahead of a Saturday class

As a volunteer, I want to register my type of attendance ahead of a
Saturday class

As a volunteer, I want to view the attendance type of all the trainees
and volunteers for a given Saturday class

As a volunteer, I want to be able to quickly update my attendance type.

As a volunteer, I want to be able to automatically sort trainees and
volunteers into breakout groups based on their attendance data according
to some clearly stated criteria, for example:

- Trainees attending a hub in-person, say Leeds, where at least one
volunteer is present won’t need to go into a breakout room.\
Trainees attending a hub in-person, say Leeds, where no volunteers
are present will need to go into a breakout room.
- Trainees attending remotely will need to go into a breakout room

As a volunteer, I want to be able to override any breakout groups that
are generated automatically.

Stretch goals

Pathways

The app can also handle a situation where a group of trainees are on
several pathways and need to go into separate breakout rooms.

Class Planner integration

A previous Final Project built the Class Planner, which volunteers use
to plan classes.
https://classplanner.codeyourfuture.io/

How can the Hub Planner integrate with the Class Planner? Is it useful
to do this? You might need to do some user research and talk to the
Class Planner Product team.

Impact (Data)

Business problem

At CodeYourFuture, we use data to understand the impact of everything we
do. We spend a lot of time diving into our data and tracing outcomes,
and we use charts, graphs, and quantified impact statements in our pitch
decks, grant applications, and regulated reporting.

But this is a ton of work; we repeat ourselves a lot, and we don't have
a branded, organised way to explain these insights to others, including
showing our working out and how we came to make these statements.

How can we explore, explain, store and share these
insights in an organised way?

What is the simplest thing that can possibly work?

Proposed functionality

A way to pull anonymised data from multiple sources
- We have the live data feed
- What other data sources do we use a lot?
A way to interrogate data for the common questions we ask
- Are there existing products we can use for this? What is
  simplest?
A way to visualise data for the common questions we ask
- Are there existing products we can use for this? What is
  simplest?
A way to share impact data
- Can we export CYF branded graphs and visuals?
- Can we embed impact statements on Google Slides or websites?

This application could be full stack or front end. It is data focused.
The front end must score 100 for Accessibility on Lighthouse.

Users and roles

As a CYF grant writer, I want to make clear, fact-based statements about
our impact..

As a grant maker, I want to see the methodology for impact statements so
I can verify them.

As a CYF data contributor (trainees and alum), I want to know that my
data is being used correctly to support CYF's work and future trainees.

As a CYF member, I want to be able to talk about CYF's work with strong
facts I can find and share easily.

As a regulator, I want to make sure Personally Identifying Information
is not shared and all data is anonymised before store.

Stretch goals

Admin view

This product uses open data sets. CYF also has some private data
sets, which cannot be connected publicly. What would you need to do
to make this application secure for this data? Is it wise to do
this? What are the implications?

User Research

Speak to staff about how they use data to help support CYF and what
kinds of impact statements would help them most.

Things to Consider

Don't get overcomplicated. Start with a single data point comparison
between two data sources. Use existing products to help you. Identify
and build the missing piece for this use case.

💹RAWGraphs

📌 CYF Data feed is pinned in general : CYF DATA Feed
[LIVE]

Common datasets we compare against:

Here are some examples of CYF use of trainee data

Anonymised and aggregated reporting, which you can see hereCYF
DATA Feed
[LIVE]
Here's an example of slides we show to partners:CYF corporate
volunteering
[LIVE]
Here's an example of a report prepared for OfstedSelf Assessment
Report (SAR) 26-1-23
[PUBLIC]

In A Class of Our Own

Business problem

At Code Your Future, trainee progress is tracked on a trainee tracker
against
milestones
set by the Director of Education. But each trainee at CYF is on their
own personal journey towards employment, and should really set their own
milestones on their own roadmap.

Proposed functionality

A way to define your milestones
- How will you quantify your milestones? The trainee tracker code
  is available for you to incorporate as your starting point.
A way to check your milestones
- Course milestone data is harvested from platform APIs (Codewars,
  Github, etc) and this code is available to you on request. What
  other goals might trainees set?
A way to display your progress over time
- You’ll probably need a user account and some kind of dashboard.

Your solution should be stored in a database and displayed by a front
end which scores 100 for Accessibility on Lighthouse.

Users and roles

As a trainee at Code Your Future, I want to set my own milestones for
the course.

As a trainee at Code Your Future, I want to see and track progress
towards my own milestones, as well as the ones set by the course.

As a mentor at CYF, I want to support each person as an individual
towards their own career goal.

As a Programme Manager, I want to include trainee-chosen milestones in
my evaluation of progress.

As an Education Director, I want to support each person as an individual
towards their own career goal, while being able to get a reasonable
overview
of how our cohorts are doing.

What else do users want? How will you find out? Some user research may
be needed. Remember: Do the simplest thing that could possibly work.

Stretch goals

Public API
- To allow other services to pull the progress data, can you build
  a public API. The Attendance Register
  project
  has this goal; can you share your work?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Notes

There is an existing tracker that harvests this data and quantifies it
here
https://docs.google.com/spreadsheets/d/1VoSIXo1M8RYFH8CexyAeDk2KrdxXpY6hDUmS1Ae_WMU/

Jobs from the boards

Business problem

At Code Your Future, graduates trawl job boards and gather leads as part
of their Employment Programme. Graduates use Slack channels and calls to
share their leads and progress with applications.

But we also duplicate a lot of effort, and job hunting is exhausting
enough already.

How can trainees discover and apply for jobs in an organised way?

Proposed functionality

A way to consume listings
- How will you consume multiple APIs? Is it better to start with
  one feed and then add a second?
- How will you normalise the data into one standard job listing
  with the details a CYF grad cares about?
- What job
  schema
  already exist?
A way to produce listings
- How will you only show jobs that are still available?
- How will your users sort and filter jobs to only the show the
  ones that are right for them?
A way to analyse jobs
- Is it valuable to know which employers have already hired a
  CYFer?
- Is it useful to identify keywords and highlight them in the
  listing?
- What about salary ranges; is this key data for users? How will
  you find out?

These jobs should be stored in a PostGreSQL database and displayed by a
React front end which scores 100 for Accessibility on Lighthouse.

Users and roles

As an applicant for junior developer roles, I want to browse and
filter jobs that I have a chance of getting

As a mentor, I want to scan open listings and get a sense of the
current market for my trainees.

As a staff member, I want everyone to share their leads and work
together so we don’t get too broken down by job hunting..

Stretch goals

Slack feed
- Should new listings post to Slack? Will you create a
  webhook?
Keyword scanning
- Can you produce a dictionary of important keywords that CYF
  applicants would want highlighted? What user research will you
  do to identify these words?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Things to consider:

There are enterprise solutions to this problem, like Google Cloud
Talent
Solution.
What are the advantages and disadvantages to building your own?

There are many paid job aggregation APIs, but there are also some free
ones. How do these job aggregation APIs get their data? What is web
scraping?

Some free Job Board APIs

Knowledge Checklist

Business problem

At CodeYourFuture, our students gain a vast amount of knowledge and
skills that in total, will result in them being able to call themselves
a programmer.

It’s important that we can track a student's progress over the course
to make sure that they are keeping up with the class and developing
their understanding of our material.

Proposed functionality

The website should be able to have a list of skills that students are
expected to achieve. For each item in this list we should be able to
rank the students’ confidence with the skill.

Skills should be separated into categories depending on what they are
about e.g. HTML/CSS, React, Node etc

Students should be able to create an account to track their progress
over the course. These accounts should be publicly accessible on a path
on the website e.g. cyf-knowledge-checklist/august but individual
information cannot be accessed without authentication.

Each student should be attached to a class.

All data should be stored in a database using an API to interface with
it.

Users and roles

As a student, I want to be able to create an account that will hold all
of my knowledge checklist data.

As a student, I want to be able to update and chart my own progress

As a mentor, I want to be able to edit the class learning objectives in
each of the subjects.(this should only be possible before a cohort
starts - see stretch goals)

As a mentor, I want to be able to see an overview of all of the students
in a given class.

Likely challenges

Be careful how you structure your data as this could get confusing
quickly

Existing Systems

Here is a very simple example of this system created by CodeYourFuture

https://cyf-course-checklist.netlify.app/

The success view on the curriculum aggregates learning objectives into a
checklist.

Stretch goals

Resources & Assessment
- If a student says they are not confident in a subject show them
  a set of resources to help them
- If a student says they are are confident in a subject, direct
  them to complete an assessment piece of work
- As an admin, I want to be able to edit the resources and
  assessment for each topic
User Research
- Speak to your classmates about what features they’d like to use.
  Select a sensible feature and build it.
- Speak to your teachers and mentors to see what features they’d
  like to use in the app. Select a sensible feature and build it.
Dark mode / toggling modes (accessibility)
- As any kind of user, I would like to be able to toggle my
  preference to use dark mode
- If possible, as a user, I would like other options for the
  colours used on the background and text
Prevent editing of learning objectives after a class starts
- As a mentor, I should not be able to edit the list of learning
  requirements once a class has started

Like Sands

Business problem

At Code Your Future, we try to save money as much as possible, so we can
do the most with our limited funds. But sometimes it's hard to perceive
the costs of our decisions and allocate our resources wisely.. For
example, if five people spend one hour deciding whether to buy one
software licence, it might actually be cheaper just to buy the software
instead of having the meeting.

How can we better understand the value of our time? How can we help each
other to not waste precious resources that could go towards trainee
expenses or infrastructure improvements.

What is the simplest thing that could possibly work?

Proposed functionality

Poll salaries

Privately poll each meeting attendee for their annual salary

Do not permanently store or visually display this personal information

Calculate cost

Combine the salaries and compute the cost per second of the combined
time of the attendees

Display cost clock

Display a cost per second ticking up in the Google Meet call

Users and roles

As a staff member, I want to visualise the cost of discussing
resource allocation

As a donor, I want to know CYF rigorously examines its own use of
funds

Stretch goals

Can this extension integrate with Google Calendar and project the
cost of proposed future meetings as well?
It costs a company much more than the annual salary to employ
someone; can you include those costs as well? Or a rough percentage?
Could an attendee also input the cost of the resource being
discussed, if any, so if the cost of the meeting surpasses the cost
of the resource, the attendees are notified?

Things to consider

If there are only two people in the meeting, each party can deduce the
annual salary of the other. Is this a problem? How will you tackle this?
Can CYF provide a blended employee cost per second default value that is
used instead in this scenario?

http://www.expensivemeeting.com/
is a longstanding website that does a basic version of this idea. What
can you learn from it?

Agencies and contractors must calculate their
costs
in this way to understand how much to bid for work. What can you learn
from applications like
Synergist,
and what is "overkill" for your product?

Logistical Lunch

Business problem

At CodeYourFuture, we are used to meeting on Zoom for every occasion, as
we are living through a global pandemic.

But now we need to adapt to meeting together in person every weekend. We
need to figure out our travel arrangements and, most importantly, what
we will do for lunch!

This project is about systematising the management of the flow of
things and people, according to complex and sometimes competing
requirements: logistics.

Proposed functionality

Phase 1:

Optimal starting time.

Using the group’s starting positions and chosen mode of transport,
evaluate a distance matrix to pick the optimal start time in the
morning.

Phase 2:

Organise lunch

Create an interface to gather and display the answers to, at least,
these questions:

How many people will need lunch today?
Who is in charge of making lunch today?
Who is in charge of buying the ingredients today?
What is the budget?
What are the dietary restrictions that must be considered?
Where is the nearest supermarket?

Users and roles

As a class organiser I want to coordinate the morning start time with
all the trainees.

As a lunch shopper, I want to know what to buy and how much to spend.

As a lunch maker, I want to know what to make and for how many people.

As a lunch eater, I want to make sure that I don’t die from a terrifying
anaphylaxis.

Likely challenges

How will you calculate the distance matrix?
Do you need user accounts to solve these logistical problems?
How will you keep the origin coordinates of individual students a
secret? Do you need to associate identities and origins at all?

Existing Systems

Can you use the Google Maps Distance Matrix
API
or the Distance
Matrix to
calculate the distance matrix?
What do you know about the
https://classplanner.codeyourfuture.io/

Stretch goals

Integrate
- As a class organiser, I’d like to access this logistics app from
  the Class Planner
Lunch assistant

As a lunch maker, I’d like suggested recipes from a database of
successful class lunches.
As a lunch shopper, I’d like a suggested shopping list.
As an organiser, I’d like for the lunch maker and shopper to be
selected on a rota.

Afternoon break

A substantial stretch feature could extend this product to negotiating
the afternoon break schedule as well. Some starting user stories are
provided to help you think about this feature.

As a Muslim, I need to schedule an afternoon break for prayers.
As a breastfeeding mother, I need to schedule an afternoon break to
feed my baby.
As a disabled person, I need to schedule an afternoon break to manage
my medication.

Love me Tender

Business problem

At Code Your Future, there are various opportunities for contract software development work. However, there is no centralised platform to publish these tenders and allow qualified suppliers to bid on them.

We like fairness and opportunity. It's really important to us that everyone has the same fair chance to bid for contracts.

How can trainees discover and bid for contracts in an organised way?

What is the simplest thing that can possibly work?

Proposed functionality

A way to publish tenders
- How can staff easily describe their business problems
- What details will be included in a tender listing? Scope, deadline, skills required, etc.
- How will you structure fairness into the process?
A way to browse tenders
- How will you only show jobs that are still available?
- How will your users sort and filter jobs to only show the ones that are right for them?
A way to bid on tenders
- How will contractors bid on available tenders? Will you build a UI for them to submit their proposals?
- How will you ensure only available tenders are shown? Will you implement a status flag in the database?

These tenders should be stored in a database and displayed by a front end which scores 100 for Accessibility on Lighthouse.

Users and roles

As a CYF staff member, I want to easily publish and review tenders to efficiently match projects with contractors.

As a contractor, I want to find available tenders and have the opportunity to bid for them

As a contractor, I want the tendering process to be useful training for me, even if I don’t win the contract

As a mentor, I want to have an overview of the tenders to provide guidance to aspiring contractors within the CYF community.

Stretch goals

Slack feed
- Should new listings post to Slack? Will you create a
  webhook?
Keyword highlighting and filtering
- Can essential skills or technologies be highlighted in the tender UI?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?

Who will define the Github action? How will you decide what budget to set?

Things to consider:

There are enterprise solutions to this problem. What are the advantages and disadvantages to building your own? There are also many Open Source tendering platforms. What can you learn from them?

How can the Contracts Finder Service
and Find Tender Service help you? Can you make use of their FOSS API?
(Also see V2)

How can the Change Board help you? https://github.com/CodeYourFuture/Changes

CYF would really like to adopt this project, if a build can meet our needs. Consider the Technology Code Of
Practice
to help you understand how to get your project up to a production standard. We want the simplest version we can possibly use.

Project Bolan (FE)

Business problem

Using Chrome, if you try to access a website while offline you can play
a game. Alternatively you can access the game by navigating to
chrome://dino in the URL bar. More info can be found on
Wikipedia.

The game is a fun Easter Egg when the user might be frustrated at the lack of internet connection. It may
be a fun thing to add to your apps in the future to add some light relief.

What is the simplest thing that could possibly work?

Proposed functionality

You play a dinosaur who is running to the right of the screen
As you play, various obstacles appear on the right that the dinosaur
must avoid, either by jumping over them (by pressing the Up Arrow or
Space keys) or crouching under them (by pressing the Down Arrow)
The dino runs faster (and thus the obstacles also move faster) over
time
A score counts up over time

Users and roles

As a player, I want the dino to move to the right when playing the
game.

As a player, I want randomised obstacles to move to the left when
playing the game.

As a player, I want to control the dino jumping/crouching via the
keyboard.

As a player, I want a score to be recorded.

As a player, I want the dino to speed up over time.

Stretch goals

A high score is recorded for the player
Instead of a dino, make a custom CYF character

Things to consider

When implementing the game, try looking at
requestAnimationFrame.

Q&A Site

Business problem

It’s very common for students (and sometimes mentors!) to have technical
issues running their code - errors, unexpected outputs, or refusing to
run entirely. The Technical Question Form (see the ⚡️ icon in e.g.
#london-class6) has a good structure but asking questions like this in
Slack is difficult for a number of reasons, e.g. it doesn’t handle (and
format) code very well and threads disappear quickly. Stack
Overflow has a very mature UI
for asking code-related questions, but asking there is a big step; it’s
not really designed for beginners and the comments don’t provide enough
space for a complex back-and-forth. We could bridge the gap with a Q&A
system of our own, which would hopefully improve the quality of
questions, both getting better answers now and preparing students for a
better entry to asking on Stack Overflow.

Proposed functionality

The key functionality would be a way for the asker to post and
subsequently edit a question, comprising an explanation of the context
(why the code is being written, e.g. linking to a class or homework),
the expected outcome, the actual outcome and the (HTML, CSS, JS) code. A
question could then have responses: follow-up questions, to give
feedback and clarify what is being asked; and answers.

Users and roles

The primary roles in the system will be people asking questions, and
people responding to them with follow-up questions and answers.

Likely challenges

How can we develop a structured format that encourages clear,
high-quality questions? How do we encourage good feedback and refinement
of questions? How do we manage different types of content (text vs.
code, and different kinds of code for formatting)? There can end up
being a lot of data in a system like this, how can we create a system
that scales efficiently to deal with that (e.g. showing “pages” of
data)?

Stretch goals

Some form of notification for key events (e.g. answer posted) via Slack
or email would mean users didn’t need to keep checking back for
responses. Being able to create a question straight from Slack using the
existing form would be pretty cool! What if you could run the code
examples (for client-side things, Express and Mongo might be tricky…)
right in your browser while looking at the question?

QR Code Scanner

Business problem

QR codes are a
common sight nowadays, as they can easily integrate the physical world
(such as museums, cafes, restaurants) with the digital world.

Let’s imagine we’re building a website for a museum which wants to allow
museum attendees to scan QR codes next to exhibits to see more
information.

What is the simplest thing that could possibly work?

Proposed functionality

Allow users to take a photo of a QR code and add it to an image
element on the application
Use the BarcodeDetector
API
to scan the QR code
Display the information contained within the QR code

Users and roles

As a museum attendee, I want to learn more information about an
exhibit.

Stretch goals

Allow the user to directly scan QR codes with their camera (rather
than taking a photo then processing it)

Things to consider

A QR code generator like this
one
may be useful for testing.

Unfortunately, the BarcodeDetection API does not have very good
browser
support yet,
as it is only fully supported by Chrome on Android. You may want to
consider showing a warning message to the user if it is not supported.

Quiz App

Business problem

With a large group of students it’s difficult to track how everyone is
doing with the material; we move quite quickly through the course at
CYF, and a student can sometimes fall behind without the mentors
realising. We’ve had quizzes at the end of some of the modules, but
these take a lot of effort to prepare and mark, and the earlier we
understand a student’s position the more support we can provide.

We’ve been experimenting with Kahoot! for this in London, running
quizzes at the end of classes to figure out how people are getting along
with the material. However, Kahoot! isn’t
free, it
prioritises being fast (which can put unhelpful pressure on students)
and it would be nice to have a system that we could integrate more
closely with the other tools we’re using.

Proposed functionality

Similar to Kahoot!, the quiz app will allow a lead mentor to prepare
simple quizzes to give throughout the modules (e.g. one before lunch and
one at the end of the day). It will then allow them to present the quiz
to a class and enable the participants to answer the questions.

Users and roles

There’ll be three kinds of user for this: the lead mentor preparing the
quiz; the students (and maybe floating mentors!) taking part in the quiz
on the day; and the other mentors reviewing the results to try to spot
patterns and offer additional support (or suggest improvements to the
course material and teaching) where required.

Likely challenges

This app will probably have lots of different views - on top of the
“preparing quiz” and “reviewing results” views, the on-the-day usage
will have distinct UIs for the participants’ devices (answering the
question), the lead mentor (tracking participation) and the projector
(showing the question). How can we show different kinds of question? How
would e.g. code examples and pictures work out? How can we help the lead
mentor preview their questions, and get them reviewed (so they don’t
make the students go through a quiz with mistakes)? How do we make this
accessible so that any user can take part (e.g. responsive design,
keyboard usage, …)? Can we usefully categorise questions, or set
estimated difficulty, to give more insight into class progress?

Stretch goals

Interactivity: you can build a simple app with a
request/response pattern and polling, but to make the app more
interactive (e.g. scores in real time) you’d have to look into
something like
websockets
Analysis: initially you could just allow export of the data for
import to Google Sheets for further analysis, but what if there were
tables and charts available directly in the tool?
Scoring: a simple version of this app would just store the
participants’ answers, but if you wanted to add a competitive
element you could develop a scoring system.

Radio Free YF

[Note: this challenging project requires significant up front research
on API restrictions]{.mark}

Business problem

At Code Your Future, we like to dance, we like to share our music, and
we like to stream coding music while we work. But we don't have our own
radio station to share and discover music that resonates with the
community.

What is the simplest thing that could possibly work?

Proposed functionality

Spotify integration

A way to pull playlists from multiple Spotifys

How will people submit their playlists? Will the API let you do this
or will you use Slack?
Who decides what gets played? Anyone?

Visualisations

A way to display the current song playing

Can you generate a waveform and animate it?
Can you pull the cover from the API and show it?
What about the current 'DJ'? How will you represent the CYFer
playing the track

Memory

Do we need a way to browse the tracks already played?

Can you put 'sets' on a calendar?
Will you make the past tracks searchable? There are restrictions on
storing data in the Spotify Developer Agreement.

These features should be supported by a PostGreSQL database and
displayed by a React front end, which scores 100 for Accessibility on
Lighthouse.

Users and roles

As a CYF musician, I want to share my music

As a CYFer, I want to share my music

As a CYF musician, I want to share my music! 😂(I think some more
detailed user stories would be a good idea)

Stretch goals

Lighthouse CI

Integrate Lighthouse testing into the deployment workflow
Define GitHub actions and set budgets for Lighthouse scores

Slack bot

Post the current playlist to Slack
Ask /tunes what is playing on CYF Radio

Things to consider:

There is another Spotify API project, which may be approachable if
you're on a short deadline: Team Project: Spotify Playlist
Filterer

There is a cyf music channel. Can you recruit user testers from this
group? What other things would they like from this application?

The Spotify API is free but has a lot of restrictions and is only for
personal or development use. What can you NOT do that you would like to?

This project suggests Spotify, but you can choose your own solution if
Spotify doesn't work for you. Remember to do the simplest thing that
can possibly work.

Readme Hireme

Business problem

At Code Your Future, we need to showcase the talents and skills of
graduates who are available for work. Currently, there is no
centralised, up-to-date platform for this. We could ask them to update
one, but our graduates are tired, and very busy coding! So is there a
way to harvest that activity and use it to power a graduate
directory automatically?

What is the simplest thing that could possibly work?

Proposed functionality

GitHub API integrations

A way to pull data from GitHub

Use GitHub Activity API to fetch each graduate's contributions,
projects, and skills.
Use GitHub Profile README to extract personal statements, resumes
and LinkedIn
Use GitHub pinnedItems API (GraphQL) to extract projects and
portfolio
How will you add and remove grads from the platform? Should grads do
it themselves via a GitHub login?

Visualisations

A way to display data

Can you generate graphs to visualise activity?
How will you present each grad's profile?

Search and browse

A way to search and browse for grads

How will you sort up active graduates?
How will you only show people available for work?

These features should be supported by a PostGreSQL database and
displayed by a React front end, which scores 100 for Accessibility on
Lighthouse.

Users and roles

As a graduate, I want to be able to focus on coding great projects
and know my work is discoverable

As a mentor, I want to see at a glance who is active and who is
losing motivation

As a recruiter, I want to see a range of CYF grads at a glance, and
search and filter them too for my needs

As an employer, I want to easily find suitable CYF graduates so that
I can hire skilled developers.

As a mentor, I want to make sure CYF grads spend their time on
things that will genuinely help them get jobs

Stretch goals

Lighthouse CI

Integrate Lighthouse testing into the deployment workflow
Define GitHub actions and set budgets for Lighthouse scores

Things to consider:

This app should look really smooth, because we're presenting ourselves
to recruiters. Can you recruit a UX/UI designer or front end specialist
to polish up your look? Where will you find these people?

Integrating with existing tools like GitHub requires understanding of
their APIs and data formats. How will you test your approach using the
smallest slice of end to end functionality you can first?

There are already multiple small apps and scripts in use at CYF that
pull from various GitHub APIs. Can you use these to help you?

Previously there was a project Team Project Graduate Platform
[RETIRED]
which several teams built, but we never integrated or updated. Make sure
your solution is lightweight, easy to maintain, and does not rely on
manual input of data.

Pin the Mood

Business problem

People recommend things (books, TV shows, music, etc). Sometimes we
don't get around to trying them out for a while. We want a website to
track those recommendations, and to help us pick things when we're in
the right mood for them.

User roles

We will make a single-user website, with exactly one expected user:

Collector - someone who receives recommendations, and wants to log
and track them.

User stories

As a collector, I can save a recommendation, including at least the
following information:
- What the thing being recommended is
- Who made the recommendation
- What medium of the recommendation is (e.g. book, TV show, movie,
  …)
- The mood of the recommendation (e.g. upbeat / scary / thoughtful
  / …)
  - One recommendation may have multiple moods!
As a collector, I can see a list of recommendations that have been
made.
As a collector, I can filter the recommendations based on any
combination of:
- Who made the recommendation
- The medium of the recommendation
- The mood of the recommendation

Stretch User Stories

Ability to add custom recommendation media (e.g. if someone
recommends an "immersive theatre" event, that can be entered as a
new medium when saving)
Ability to add extra moods
Ability to rate recommendations
- Analytics about who makes the best recommendations

Table stakes

Unrelated to any one user story, the following requirements must always
be met:

The website must be deployed somewhere where it's accessible to
anyone with internet access.
The website must be fully accessible.
If an error occurs, it must be obvious to the user that something
has gone wrong, and what they should do about it.
Any data must be persisted - re-deploying or re-starting the server
must not lose any data.

Suggested implementation plan

High Level

Talk through what functionality should live where.

For all of the user stories you're likely to target:

a. Sketch out some wire-frames to map out the user experience.

i.  Wireframes can be as extensive or detailed as you want. It
    could range from a simple pen paper design to a detailed
    figma design; whichever suits your needs better.

ii. You can always add more detail when you\'re focusing on any
    one user story.

b. Model the data in database tables.

Make your frontend, backend, and database work both locally and
deployed - you should be able to switch between these just by
setting up a .env file.
Choose some user stories to focus on first, and:
a. Write backend features which you can test out with curl/postman.
b. Add frontend features to visualise the data from the backend and
interact with it.
c. Deploy everything.
Iterate.

Day by day

Day 1 - Day 2 : Planning phase (no coding if you can resist) -

Might seem long and an overkill but will benefit you at next steps. Key
steps to complete (you pick the order):

Design the DB for your business problem.
Pick a feature that you want to focus on.
Identify different pages / views required for the selected feature.
Design Wireframes.
Identify the API endpoints the feature would require.
If time left complete the basic setup - setup a react app, express
server & connect them with each other. Note - You can test with a
simple endpoint if the frontend and backend are connected.

Day 3 - Day 4 - It's a choice you can start from the front end / back end.

Backend

Create DB and tables.
Basic app structure, setup of the express routes, skeleton only.
Just routes with simple console.logs.
Implement the full logic of the route including db calls - test with
PostMan/curl.
Implement the front end that calls these api endpoints / routes.
Go back to step 2 of this section & iterate.

Frontend

Implement the front-end view.
Use dummy data to style it.
Once happy with the layout, implement backend endpoints and replace
dummy data with fetch statements.
Go back to step 1 of this section & iterate.

Day 5 onwards

Iterate.

STAR

Business problem

At CodeYourFuture, trainees keep a brag diary to build up a bank of
examples of their skills, knowledge and capabilities. They need these
examples for interviews.

Everyone does this differently. But really everyone should record these
in the format they need for interview: STAR.

STAR means Situation, Task, Action, Result.

How can trainees record, review, and recall these examples
in an organised way?

Proposed functionality

A user account for each trainee.
A way to record examples in the STAR format
- Can this be a template?
- Should this be a conversational form?
A way to review examples
- Can a view show many entries together so users can browse their
  diaries
- Can users link or share an entry with a mentor if they choose?
A way to recall examples
- Can entries be searchable, perhaps using a free Algolia React
  plugin?
- Can we record and show the date of the event/experience
  happened, instead of the date the entry was made on the website
- Can we tag entries? Is that useful?

As the trainee completes the course, a constellation of STAR answers are
accumulated.

These answers should be stored in a PostGreSQL database and displayed by
a React front end.

Users and roles

As a student, I want to be able to create an online diary that holds all
of my STAR based entries.

As a student, I want to be able to return and update and improve my
entries as well as answer general interview questions using them.

As a TA, I want to know that trainees are regularly adding to their STAR
accounts and even suggest to them ‘hey, you solved that, or helped - add
it to your STAR account’.

As a PD mentor, I want to be able to discuss their examples and help
them elaborate and celebrate both their CYF and non-CYF STAR examples.

Stretch goals

User adaptability
- A trainee can select and answer a particular interview question
  listed.
- A STAR entry can be compiled and shared by a trainee , either
  with others or to a document.
User Research
- Speak to trainees about what extras would help them write their
  STAR entries - prompts or questions?
- Speak to PD mentors and past students to ask how many examples
  should trainees be aiming to provide - or how many skills do
  they suggest to demonstrate (and which ones)?

Scout Activity Scheduler

Business problem

One of the volunteers (Ali Smith) also helps out with a group of Scouts
who plan an international expedition to the Swiss Alps every 5 years.
Since this is a big (and expensive) trip, the organisers offer each
individual Scout the choice of 3 activities that they would like to do.

Once the activity choices have been submitted, the organisers produce
groups for each of the activities. These groups are then added to a
daily schedule, fitting around some activities that the whole group will
do together.

The schedule has the following constraints:

Groups can be configured to either fill 1 day or 2 days on the
schedule
All of the groups are added to the schedule at some point during the
trip
No individual Scout is doing two activities on the same day
It is allowed for an individual Scout to not be assigned to a group
on each day. An activity will be created for them to do on that day

In the past, this planning has been done by writing out the groups on
pieces of paper and moving them around until a suitable schedule is
found. However, this requires a lot of manual checking, so producing the
schedule more easily in software is desirable.

What is the simplest thing that could possibly work?

Proposed functionality

Users and roles

As a trip organiser, I want to generate a schedule that meets all of
the constraints listed above.

As a trip organiser, I want to generate multiple schedules that can
be chosen from based on other “non-computable” properties (e.g. avoiding
schedules that “too tiring” for individual Scouts)

Stretch goals

Things to consider

Ali Smith is happy to be consulted on the requirements.

Ideally the app should be working (and verified) by the end of January 2024.

Shared Bookmarks

Business problem

As developers, we spend a lot of time reading articles on the web and we
often want to record useful links to come back to them later. It is fun
to share your bookmarks with others so that they can find interesting
and useful links too.

Here are some examples of bookmark sites:

What is the simplest thing that could possibly work?

Proposed functionality

Display a list of links stored as JSON files within the repo
- Each JSON file contains the URL, title and a description of the
  link

Users and roles

As a developer, I want to share a list of interesting/useful links
that I’ve found.

Stretch goals

Allow a user to search the links
Switch from storing the links as JSON files to a database. To do
this securely, this may require supporting authentication
- Suggested approach: design the authentication so that only 1
  user is supported. You can then fake “registering” this 1 user
  behind the scenes and save the password so that only 1 person
  can log in
Allow other developers to subscribe to updates by supporting RSS

Things to consider

Slack dashboard

Business problem

Slack is the main forum for communication between all of the members of
the CYF family during the week; there are a lot of messages and calls
going back and forth between various groups and channels. It allows us
to provide mentoring during the week, even though we’re only able to get
together as a whole group on Sundays, and is a core part of the CYF
social network.

However, this extensive communication means it’s sometimes difficult to
keep track of who’s been talking and how much. This means that we can
miss out on when a trainee has stopped communicating, which can be a
signal that they need further support. Communication is one of the key
soft skills we’re encouraging, too, and we want to be able to evaluate
how trainees are doing at this.

Proposed functionality

To help trainees and mentors understand communication levels in each
city, this application will create a dashboard to view statistics of
Slack usage for each week of the course. To encourage trainees to be
proactively communicating their progress with the rest of the group, the
mentors will be able to set individual and class targets.

Priorities

Aggregated Communication stats (messages and calls) of certain
number of trainees in a given Slack channel over a period of time
/mentor
Ability to create different cohorts based on a region, list of
trainees and a number of Slack channels /mentor
A unique trainee profile that summarises their personal stats per
week and overall

Users and roles

Both trainees and mentors will be able to see information about the
levels of communication in class and city channels (although the
trainees’ view will only show their detailed data). Additionally,
mentors will have an administrative role, setting individual and class
targets for number of messages and number or duration of calls.

Likely challenges

Building this application would require integration with the Slack
API pretty early on (you can build
some dashboards with canned data to prove out the UI, but we want this
whole process to be as automated as possible). The data itself can be
pretty boring, so how do you make it fun to use, could you try some kind
of gamification? How does this align with trainees’ incentives and drive
the behaviour we’re actually trying to encourage (we don’t want people
posting “asdf” just to get their numbers up, for example - how do we
encourage quantity and quality)?

Stretch goals

Notifications: can we prompt trainees to hop back into the
channel if they’ve been away? What if it’s for a reason? Can they
snooze these messages and/or be prompted to contact a mentor?
Integrations: how can we get this Slack data into e.g. Google
Sheets along with the other information we have about trainees'
progress?

SpaCy Aliens

THIS PROJECT COULD INVOLVE SOME PYTHON

Business problem

At Code Your Future, trainees are often learning many languages at the same time, and English is just one of them. During class and in study
sessions, we get lots of practice with English but during the week sometimes we need a buddy, especially to practise professional scenarios like job interviews, code reviews, and demos. Most English support available does not support trainees with highly technical conversations, and hardly any can translate technical concepts from a different language we already know.

How can trainees practise business English with a tech focus in a single, purpose-built platform? Can they use a chatbot that converses with users in their target language, providing corrections,
explanations, and relevant vocabulary based on the context of the
conversation.

What is the simplest thing that could possibly work?

Proposed functionality

Contextual Learning Engine

Detect conversation topics and suggest relevant vocabulary and phrases.
Use NLP to correct syntax and grammar mistakes in real-time.

Daily Scenario Simulations

Simulate common daily scenarios like responding to code review,
asking for help with blockers, analogising technical concepts, etc.
Create a specific prompt for practising Technical Interviews

Users and roles

As a language learner I want to practice English in a real-world context

As a part-time learner I want to practice English on my own schedule

As a mentor I want to suggest realistic scenarios for my students
to practice English

Stretch goals

UX: Create a logged in area to track progress
QE: Integrate Lighthouse testing into the deployment workflow
Cloud: Define GitHub actions and set budgets for Lighthouse scores
AI: Integrate voice recognition

Things to consider:

The back end can be a REST API and the front end a single-page app,
which scores 100 for Accessibility on Lighthouse.
Consider running spaCy in the browser using WebAssembly.
Consider the tradeoffs of using ChatGPT vs spaCY and pick the simplest thing that can possibly work
This is a challenging project suitable for grads and high-performing trainees
Look at Tip of Our Tongues for ideas from a related project
Chat GPT Prompts for Technical English
Conversation
Conversational · spaCy
Universe
Flask
spacy-wasm · spaCy
Universe

Study Buddies

Business problem

At Code Your Future, trainees form study groups to work together during
the week.

It’s very complicated to arrange this as everybody has different
schedules. Some trainees work nights, others look after their children
during the day; some trainees work zero hour or gig jobs and their
availability changes all the time.

Everybody’s schedule is different, but many people’s schedules are
complimentary. If we could all put our availability in one sorting
system, an application could tell us who has matching availability.

How can trainees discover and connect with study partners in an
organised way?

Proposed functionality

A way to enter your availability
- How will you define availability and time?
- What is the minimum and maximum amount of time to make available
  for a useful study group?
- Can users connect their Google calendars to enter availability?
  And is this MVP?
A way to match with other trainees
- How will you only show trainees with overlapping availability?
- How will users book this time; is there a maximum number of
  trainees that is useful to form a study group?
- Should everyone in class be matched and grouped at once, or
  should trainees do this ad hoc?

These availability ranges should be stored in a PostGreSQL database and
displayed by a React front end which scores 100 for Accessibility on
Lighthouse.

Users and roles

As a trainee at Code Your Future, I want to form study groups with
people who are available without constantly negotiating with 30 people.

What else do trainees want? How will you find out? Some user research
may be needed.

Stretch goals

Jack Jones
- What happens when someone cannot match with anyone? How will you
  discover and communicate this situation to their cohort?
Preference ranking
- Sometimes we can be available if necessary, but it’s not very
  convenient. Could users rank their availability?
Lighthouse CI

Can you integrate Lighthouse testing into your deployment workflow?
Who will define the Github action? How will you decide what
budget
to set?

Tip of Our Tongues

Business problem

At Code Your Future, trainees and mentors collaborate and communicate
with each other while working on projects. However, sometimes we face
difficulty in phrasing our comments, questions, or feedback effectively,
especially for those of us who are speaking English as an additional
language.

How can we use APIs like DataMuse, Wordnik, and Grammarly to craft
clearer and concise messages in English? How can we use speakable
elements to check we are saying words clearly? How can we use technology
to improve our communication skills and overall collaboration
experience?

What is the simplest thing that could possibly work?

Proposed functionality

Input message

Allow users to input their initial comment, question, or feedback
Phrase suggestions

Evaluate message

Use Grammarly, DataMuse, or Wordnik APIs to generate alternative
phrasings, synonyms, or related terms
Offer suggestions for more concise or clearer wording

Message refinement

Users select and edit suggested phrasings to create a final version
of their message

Speakable

Allow users to hear the pronunciation of words or phrases in their
messages
Provide an option to adjust the speech rate and volume for better
understanding

These features should be supported by a PostgreSQL database and
displayed by a React front end, which scores 100 for Accessibility on
Lighthouse.

Users and roles

As a CYF member, I want to improve my communication skills and
ensure my comments, questions, and feedback are clear and concise in
English.

As a project manager, I want to enhance the overall collaboration
experience within Code Your Future, ensuring effective communication
among all participants.

Stretch goals

Sentiment analysis

Use sentiment analysis to ensure that the suggested phrasings convey
a positive and supportive tone

Lighthouse CI

Integrate Lighthouse testing into the deployment workflow
Define GitHub actions and set budgets for Lighthouse scores

Things to consider:

Integrating with APIs like DataMuse, Wordnik, and Web Speech API
requires understanding their features and limitations. How can you check
the suggestions provided by these APIs are accurate and relevant?

https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance

https://www.datamuse.com/api/

https://developer.wordnik.com/gettingstarted

https://developer.grammarly.com/docs/api/editor-sdk-react/

Important Note to Developers: This project could be highly
challenging or could be a fairly simple React
component
. The real skill here is to start with the simplest thing that could
possibly work.

If the groundwork is solid, this project could be adopted by CYF Labs,
so get the fundamentals right first.

This App Ointment

Business problem

Outside of London, trains don't really work. It makes it really
difficult to plan meetups as everyone is delayed all the time, sometimes
for hours. It would be great to identify the most reliable place and
time to meet for most people, based on actual train times not
timetables.

How can we plot a meeting point between a group of people that is more
reliable and minimises the chance of intolerable disruption,
disappointment, and delay?

This project is all about data and insights. Be very very careful about
your scope.

What is the simplest thing that could possibly work?

Proposed functionality

A way to enter locations

A way to join a meeting group

A way to identify an optimised location

A way to share the identified meeting location

A way to access everything on a phone (in transit)

Users and roles

As a community member, I want to look forward to in-person meetings
instead of dreading them

As a community organiser, I want to arrange meetups people show up
for!

As a tired and old person, I want to spend less time freezing on the
platform at Manchester Victoria

Stretch goals

Considering setting further parameters like:
Maximum time each person is able to spend travelling
Maximum price each person is able to spend on tickets
Save favourite locations to groups
Help users recommend places around train and bus stations that can
host CYF groups (this could be an integration with Maps)

Things to consider

Some people may not be able to share or publish their location; how
will you protect privacy?
There is an incredible website called Recent Train Times; what can
you learn from it?
https://www.recenttraintimes.co.uk/Home/About
Can you use the Google Distance Matrix API to help you?
https://developers.google.com/maps/documentation/distance-matrix/overview

Time Tracker

Business problem

At Code Your Future, we often have to balance multiple commitments and
so need to use our time efficiently. To help understand how our time is
being used, we could use a time tracker to track how much time has been
spent on a particular task. This can then be visualised to understand
where time could be used more efficiently.

What is the simplest thing that could possibly work?

Proposed functionality

Tracker

Allow a user to input a description of a task and start a timer for
that task
The amount of time until the user clicks the stop button is recorded
- This could be stored in the browser e.g. with localStorage

Visualisation

A graph showing the amount of time each task has cumulatively taken
over the whole day
A graph showing the amount of time each task has cumulatively taken
over the whole week
See https://timeryapp.com/
for inspiration

Users and roles

As a trainee, I want to track how much time a task has taken over a
period (e.g. a day or week) so that I can understand if the time could
be used more efficiently

Stretch goals

Use Toggl as a data store, see
API docs

Things to consider

This is really just re-building Toggl. How could you put a spin on it?
Can you find a way to report your data on your Coursework
Planner?
What
insights
could you send to your project
board?

Remember, start with the minimum viable product and then iterate.

Eie.io

Business problem

A city farm has volunteers who look after its animals. Every day, one
volunteer is needed every morning and every evening to feed the animals.

We need a website to ensure that every session has exactly one volunteer
signed up.

User roles

Manager - ultimately responsible for ensuring every time slot has a
volunteer.
Volunteer - can sign up for sessions.

User stories

As a manager, I need to be able to see if any sessions don't have a
volunteer signed up.
As a manager, I need to be able to see the name, email, and phone
number of the person who signed up to any session.
As a volunteer, I need to be able to see what sessions are available
to sign up to volunteer.
As a volunteer, I need to be able to see what sessions I have signed
up for.
As a volunteer, I need to be able to claim an available session.
As a volunteer, I need to be able to cancel a session I have already
signed up for.
As a manager, I need to be notified if someone cancels a session at
short notice.
As a volunteer, I don't want any other volunteer to know when I am
volunteering, to protect my privacy.

Stretch User Stories

As a volunteer, I get a notification (perhaps by email or SMS) to
remind me about my session.
As a manager, I can view statistics around how often each volunteer
volunteers.
As a volunteer, I can sign up to sessions on a schedule, e.g.
"Every Monday morning".
As a manager, I want to be able to email all upcoming volunteers
with some information.

Table stakes

Unrelated to any one user story, the following requirements must always
be met:

The website must be deployed somewhere where it's accessible to
anyone with internet access.
The website must be fully accessible.
If an error occurs, it must be obvious to the user that something
has gone wrong, and what they should do about it.
Any data must be persisted - re-deploying or re-starting the server
must not lose any data.

Short-cuts we can take

Let's not worry about log-in for now. We can just have a
button/drop-down in the corner of the screen to switch between
manager and volunteer roles.

Suggested implementation plan

Talk through what functionality should live where.
Sketch out some wire-frames to map out the user experience.
Model the data in database tables.
Choose some user stories to focus on first, and:
a. Write backend features which you can test out with curl/postman.
b. Add frontend features to visualise the data from the backend and
interact with it.
c. Deploy everything.
Iterate.

We are here

Business problem

It’s important for CYF to keep track of which students have attended
which sessions and their behaviour during the class, for various
reasons:

Teaching: understanding of who was present for which material,
so we can take that into account when assessing progress and
planning catch-up activities, and seeing who needs special attention
Finance: accurate payout of expenses for travel, etc.
Pastoral: seeing when a student has missed multiple sessions, so
we can investigate whether there’s a problem we could be helping
them with

Volunteers currently take a manual register and then copy that to a
spreadsheet by hand. This is not very reliable and it doesn’t give us as
much information as we want.

Proposed functionality

Trainees clock into classes themselves. Attendance is logged to a class
and a date (with start time), and this data is available as a public API
from which the volunteers can pull the data they need. There is already
a substantial amount of automated tracking by API for all the other
milestones.

Volunteers can flag specific participation problems, and this
information is also attached to the trainee object on the API.

Required Information

Class name
Class start time and date
Trainee ID
Trainee clock in timestamp (so punctuality can be computed)
Mentor flags: LEFT EARLY, CAMERA OFF, LOW PARTICIPATION, ABSENT

Users and roles

As a trainee I want to sign in to class on time and show that I am
here

As a volunteer I want to update trainees’ self reports and add
nuance around participation

As a cohort we want a quick report on our participation

Remember: Do the simplest thing that could possibly work.

Likely challenges

Trainees might forget to clock in – how will you handle this?
A public API cannot expose trainee names directly – how will you
handle this?

Stretch goals

*As a volunteer, I want to sign in to class and show that I am here*

Add sign in for volunteers and create a separate participation report so
that volunteer participation is also made visible

Data Processing/Reporting

Written summary - Produce a short summary of participation
- Slack integration: Post a summary after a class in a
  specific private channel for stakeholders.
Aggregated Summary - Have a summary for one or several cohorts
with detailed information for module leads
- Aggregated Visualisations - Present graphs of data to be
  able to see progress over a given time period

What Rubbish

[THIS VERY CHALLENGING FRONT END PROJECT COULD INVOLVE SOME PYTHON AND A
LOT OF LEARNING]

Business problem

At CodeYourFuture we are many of us travellers. But everywhere we go,
recycling works differently. We are highly conscientious people so this
is exhausting. Sometimes it feels like we are collectively accumulating
a PhD in recycling rules around the world. How can we know what to
recycle and what is general waste?

What is the simplest thing that could possibly work?

Proposed functionality

Computer Vision and Classification

Camera view - User points camera at trash item
Object recognition
- OpenCV for basic shape and color recognition
- MobileNetV2 model for complex items
Waste categorisation - Classify items as recyclable, compostable, or landfill
Application built as a PWA

Users and roles

As a conscientious environmentalist, I want to quickly sort my rubbish wherever I am

As a CYF host I want my offices to be cleaned up after classes

As a CYF member I want to clean up after class

Stretch goals

QE: Integrate Lighthouse testing into the deployment workflow
Cloud: Define GitHub actions and set budgets for Lighthouse scores
Data: enhance advice with the Waste Services
API

Things to consider:

OpenCV.js to perform shape and colour recognition in the browser for
initial sorting
TensorFlow.js to load a pre-trained MobileNetV2 model for advanced
object identification.
The front end could be built with React, making use of Service
Workers for PWA caching
The computer vision logic can run entirely on the client-side
OpenCV directly in the browser (webassembly +
webworker)
Adding TensorFlow.js WASM Backend in Create React App | by Gant
Laborde | Red
Shift
https://github.com/reshamas/deploying-web-app
Deploying a Deep Learning Model on Web and Mobile
Applications
Image Model - Teachable
Machines
How to build an image classifier for waste sorting | by Collin Ching | Towards Data Science

There’s an API-focused briefing for the same business problem here:
Final Project: How Does It Work
Here