|
| 1 | +export const meta = { |
| 2 | + title: 'GitHub Next', |
| 3 | + image: require('./7.png'), |
| 4 | + imageAlt: 'Screenshot of the GitHub Next website header. There’s a black Octocat logo with a star orbiting it. There’s a headline and a paragraph of text introducing GitHub Next. Below is a horizontal site navigation bar with links to different homepage sections.', |
| 5 | + url: 'https://githubnext.com/', |
| 6 | + date: '2022-10-13T00:00:00.000Z', |
| 7 | + ogImage: require('./og.jpg'), |
| 8 | + tech: 'Tailwind CSS, Next.js, React', |
| 9 | + description: 'GitHub Next is where GitHub investigates and explores what the future of software development will look like. In addition to research projects, GitHub Next also host talks with outside experts and influencers. The GitHub Next website is built on Next.js and uses Tailwind CSS as its CSS framework.', |
| 10 | +} |
| 11 | + |
| 12 | +<Intro title="Researching the future of software development at GitHub."> |
| 13 | + |
| 14 | +GitHub Next is where GitHub investigates and explores what the future of software development will look like. In addition to research projects, GitHub Next also host talks with outside experts and influencers. The GitHub Next website is built on Next.js and uses Tailwind CSS as its CSS framework. |
| 15 | + |
| 16 | +</Intro> |
| 17 | + |
| 18 | +<Image src={require('./1.png')} alt="Screenshot of the team section of the GitHub Next homepage with a 4-column grid of team profiles. Each profile contains a round headshot, a name, a title, and a link to their GitHub profile." caption="Team section with round headshots and a link to each team member’s GitHub profile. The site menu is sticky throughout the site as you scroll." /> |
| 19 | +<Image src={require('./2.png')} alt="Screenshot of the Events section of the GitHub Next homepage with a 3-column grid of white cards on a dark background. Each card contains an event title, a date, and the avatars of the team members involved." caption="Events section with a 3-column grid showing past events at which the GitHub Next team has given talks." /> |
| 20 | +<Image src={require('./3.png')} alt="Screenshot of the ‘Speakers Series 2020’ section of the GitHub Next website, with a 3-column grid showing profile images of past speakers with their name, company name, and the date they spoke listed below." caption="Speakers section with a 3-column grid of outside speakers that have given talks as a part of GitHub Next." /> |
| 21 | + |
| 22 | +<Mobile caption="The GitHub Next website experience on mobile devices."> |
| 23 | + <Image src={require('./8.png')} alt="Screenshot of the Projects section of the GitHub Next homepage on a mobile device showing two cards, each containing information about a project." /> |
| 24 | + <Image src={require('./9.png')} alt="Screenshot of a project page on the GitHub Next website on a mobile device with a headline, introductory paragraph, and some metadata and sharing options below." /> |
| 25 | + <Image src={require('./11.png')} alt="Screenshot of the Team section on the GitHub Next homepage on a mobile device showing two team profiles with a round headshot, name, title, and link to their GitHub profile below." /> |
| 26 | +</Mobile> |
| 27 | + |
| 28 | +<Image src={require('./4.png')} alt="Screenshot of a talk page on the GitHub Next website with the speaker’s name as the headline and their title and company as the subheadline. The second headline contains the talk’s title, and there is a YouTube video of the talk below." caption="Each talk given by an outside speaker has its own page. It features a YouTube video of the talk and a written article below." /> |
| 29 | +<Image src={require('./5.png')} alt="Screenshot of a project page on the GitHub Next website with the project name as a large headline and a description as the subheadline below it. Below the headline is metadata about the project, such as who has been working on it." caption="Each project has a detailed page describing the research and project work." /> |
| 30 | +<Image src={require('./6.png')} alt="Screenshot of an expandable table of contents overlay on a project page. The project’s name is listed to the left, and the table of contents is on the right. There’s a button with an ‘x’ to close the table of contents overlay." caption="Each project page has its own expandable table of contents that works similarly to a traditional hamburger menu." /> |
0 commit comments