Skip to content

Commit fc5f110

Browse files
oliviertassinarioliviertassinari
committed
[website] Update Careers page (mui#24948)
1 parent b6eb3ad commit fc5f110

File tree

7 files changed

+209
-54
lines changed

7 files changed

+209
-54
lines changed

‎docs/pages/company/jobs.js renamed to ‎docs/pages/company/careers.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,10 @@ import React from 'react';
22
import TopLayoutCompany from 'docs/src/modules/components/TopLayoutCompany';
33
import { prepareMarkdown } from 'docs/src/modules/utils/parseMarkdown';
44

5-
const pageFilename = 'company/jobs';
6-
const requireDemo = require.context('docs/src/pages/company/jobs', false, /\.(js|tsx)$/);
5+
const pageFilename = 'company/careers';
6+
const requireDemo = require.context('docs/src/pages/company/careers', false, /\.(js|tsx)$/);
77
const requireRaw = require.context(
8-
'!raw-loader!../../src/pages/company/jobs',
8+
'!raw-loader!../../src/pages/company/careers',
99
false,
1010
/\.(js|md|tsx)$/,
1111
);

‎docs/pages/company/lead-designer.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import React from 'react';
2+
import TopLayoutCompany from 'docs/src/modules/components/TopLayoutCompany';
3+
import { prepareMarkdown } from 'docs/src/modules/utils/parseMarkdown';
4+
5+
const pageFilename = 'company/lead-designer';
6+
const requireDemo = require.context('docs/src/pages/company/lead-designer', false, /\.(js|tsx)$/);
7+
const requireRaw = require.context(
8+
'!raw-loader!../../src/pages/company/lead-designer',
9+
false,
10+
/\.(js|md|tsx)$/,
11+
);
12+
13+
export default function Page({ demos, docs }) {
14+
return <TopLayoutCompany demos={demos} docs={docs} requireDemo={requireDemo} />;
15+
}
16+
17+
Page.getInitialProps = () => {
18+
const { demos, docs } = prepareMarkdown({ pageFilename, requireRaw });
19+
return { demos, docs };
20+
};

‎docs/src/modules/components/AppFooter.js

Lines changed: 25 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import React from 'react';
33
import PropTypes from 'prop-types';
44
import { useSelector } from 'react-redux';
55
import Interpolate from '@trendmicro/react-interpolate';
6-
import { withStyles } from '@material-ui/core/styles';
6+
import { styled, withStyles } from '@material-ui/core/styles';
77
import Typography from '@material-ui/core/Typography';
88
import Grid from '@material-ui/core/Grid';
99
import Container from '@material-ui/core/Container';
@@ -48,8 +48,26 @@ const styles = (theme) => ({
4848
version: {
4949
marginTop: theme.spacing(3),
5050
},
51+
careers: {
52+
display: 'flex',
53+
},
5154
});
5255

56+
const Badge = styled('span')(({ theme }) => ({
57+
alignSelf: 'center',
58+
padding: '1px 3px',
59+
backgroundColor: theme.palette.type === 'light' ? 'rgb(235, 87, 87)' : '#c55e5e',
60+
color: '#fff',
61+
borderRadius: 3,
62+
marginLeft: 6,
63+
fontSize: '10px',
64+
lineHeight: '1.3',
65+
textTransform: 'uppercase',
66+
fontWeight: '600',
67+
letterSpacing: '0.5px',
68+
display: 'inline-block',
69+
}));
70+
5371
function AppFooter(props) {
5472
const { classes } = props;
5573
const userLanguage = useSelector((state) => state.options.userLanguage);
@@ -142,9 +160,12 @@ function AppFooter(props) {
142160
Contact Us
143161
</Link>
144162
</li>
145-
<li>
146-
<Link color="inherit" variant="body2" href="/company/jobs/">
147-
Jobs
163+
<li className={classes.careers}>
164+
<Link color="inherit" variant="body2" href="/company/careers/">
165+
Careers
166+
</Link>
167+
<Link color="inherit" variant="body2" href="/company/careers/">
168+
<Badge>hiring</Badge>
148169
</Link>
149170
</li>
150171
</ul>

‎docs/src/pages/company/careers/careers.md

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
# We build the next generation of tools for UI development
2+
3+
<p class="description">Material-UI is focused on making React UI development faster, simpler, and accessible to more people.</p>
4+
5+
The open-source project started back in 2014 to unify React and Material Design. Today, Material-UI has grown to become one of the world's most popular React UI libraries, backed by a vibrant community of more than 2M developers in over 180 countries.
6+
7+
The company is bootstrapped (so far). It was incorporated in mid 2019 and yet growing fast (x2-3 YoY). We doubled the team in 2020 and are on track to do the same in 2021.
8+
9+
## Our values
10+
11+
- **Customer obsessed**. We put our customers front & center. We focus on delivering web experiences that feel amazing. We ask questions. We experiment with new ideas.
12+
- **Transparency**. Most of our work is public. We share what we work on regularly in the open. We collect feedback as soon and as frequently as possible. We learn from each other and
13+
grow from it.
14+
- **Freedom**. We work from anywhere in the world. We keep meetings to a minimum, preferring asynchronous and written communication.
15+
- **Autonomy**. We want to create a safe, high-trust team. We want you to be able to feel invested in your work and proud of it.
16+
- **Excellence**. We're aiming high, and we know it. Even the smallest details are important to us. We only want the best for each other and our customers.
17+
18+
## Perks & benefits
19+
20+
- **Remote**: Our entire company is distributed.
21+
- **Gatherings**: We meet up once or twice a year for a short week of meetings, events, and fun!
22+
- **Equipment**: Material-UI will let you choose new hardware of your choice (up to $2,500 USD).
23+
- **Flexible hours**: We work from different timezones. When the work is done doesn't really matter.
24+
- **Time off**: We provide five weeks of paid time off.
25+
26+
## Open roles
27+
28+
We're currently looking for help in the following areas:
29+
30+
### [Lead Designer](/company/lead-designer/)
31+
32+
We are looking for a lead designer to own most of our design work.
33+
34+
### [Senior Software Engineer](/company/software-engineer/)
35+
36+
<span style="font-size: 14px;">Two positions (one design system team, one advanced components team).</span>
37+
38+
We are looking for senior software engineers to help support our open-source components, assist the Material-UI community, and grow our enterprise edition.
39+
40+
## FAQs
41+
42+
### Are there application deadlines?
43+
44+
No. If a job is visible on our careers page, then you can still apply.
45+
46+
### Does Material-UI do whiteboarding during interviews?
47+
48+
No. We ask applicants to complete challenges that are close to their future day-to-day contributions.
49+
50+
### Does Material-UI offer contractor job opportunities?
51+
52+
Yes. People outside of France will be hired as full-time contractors. (Benefits may vary.)

‎docs/src/pages/company/jobs/jobs.md

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎docs/src/pages/company/lead-designer/lead-designer.md

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
# Lead Designer
2+
3+
<p class="description">We are looking for a lead designer to own most of our design work.</p>
4+
5+
## Details of the Role
6+
7+
- Location: Remote (preference for UTC-5 to UTC+4).
8+
- Type of work: Contractor (full-time, convertible to an employee position in the future).
9+
- Start date: Immediately.
10+
- We're a remote company, we prefer asynchronous communication over meetings.
11+
- We work independently, the rest of us won't know what you're doing day-to-day unless you tell us.
12+
13+
## About Us
14+
15+
See the [careers](/company/careers/) and [about us](https://next.material-ui.com/branding/about/) pages.
16+
17+
### Why we're hiring
18+
19+
Both our open-source community, and our premium products are [growing fast](https://www.similarweb.com/website/material-ui.com) (x2-3 YoY). We need talented people to keep that going!
20+
21+
We are aiming to make high-end design accessible to the many, empowering developers that lack access to a designer. We need to make the library visually more appealing (starting with this very page 🙌), support a second theme more aligned with current design trends, implement and extend our new branding, and a lot more.
22+
23+
### Why this is interesting
24+
25+
Material-UI empowers React developers to build awesome applications and websites. Hundreds of thousands of developers use Material-UI every month. Providing functional components isn't enough, far from it. In our [last developers' survey](https://material-ui.com/blog/2020-developer-survey-results/#6-what-are-your-key-criteria-when-choosing-a-ui-library), we have established that the single most important factor for using a UI library is the design. We need to empower developers to build beautiful UIs. 😍.
26+
27+
## About the role
28+
29+
So far we have been relied on the Material Design guidelines to implement great looking components. However, we have reached the point where this is no longer sufficient.
30+
31+
### What you'll do on a day-to-day basis
32+
33+
A few projects you might have worked on if you were part of the team:
34+
35+
- [Rebranding](https://www.figma.com/file/4uv2dT18rXJPZBbrbpw61q/Design-v5-For-first-implementation). We have worked with [Balkan Brothers](https://bb.agency/) to update our branding.
36+
- The update of the components to match the latest Material Design changes.
37+
38+
And more importantly, projects that you might work on once you join:
39+
40+
- A redesign of the documentation.
41+
- The implementation of the new branding, as well as its extension to new marketing pages.
42+
- The update of the components to match the latest Material Design guidelines (as long as can be done with simple CSS changes).
43+
- The design and implementation of a new theme based on the unstyled components.
44+
- The design and implementation of marketing and UI templates. These building blocks will be open source to help developers quickly get started.
45+
46+
## About you
47+
48+
We're looking for someone with an expert eye for visual and UI design. You have enough development skills (CSS-in-JS, JSX) to implement the designed interfaces. Details matter to you.
49+
50+
### Skills you should have
51+
52+
- **Expert-level knowledge of visual design**. You can create great looking UIs. You care about every detail. You can spot a kerning issue without even paying attention.
53+
- **Expert-level knowledge of UI design**. You can build intuitive UIs.
54+
- **Enough development skills to implement the designed interfaces**. Our React engineers are often busy implementing complex components. We are looking for somebody with enough CSS-in-JS and JSX skills to not depend on them to implement the design.
55+
- **Strong written and verbal communication skills**. As part of the team, you'll interface both directly and indirectly with community members and enterprise customers, and contribute to user documentation. Clear communication is fundamental in creating intuitive and compelling resources.
56+
57+
### What would be nice if you had, but isn't required
58+
59+
- **You've contributed to a design system before**. You have worked on a library of components in the past, maybe for internal usage in your company.
60+
- **You have other complementary skills**. We are a tiny team of 6 people. We could use any hidden skills that you might have. Maybe you are great at creating animations, or creating illustrations.
61+
62+
## Compensation
63+
64+
A competitive compensation of up to \$140,000 USD/year, depending on the profile. It could go higher for a person that can significantly push the mission forward. You can find the other perks & benefits in the [careers](/company/careers/#perks-amp-benefits) page.
65+
66+
## Apply
67+
68+
[Apply for this position 📮](https://airtable.com/shr1hZkKnwkrSasx3)

0 commit comments

Comments
 (0)