biq/index.html at main · kindel/biq · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Behavioral interview questions</title>
  <link rel="stylesheet" href="css/biq.css">
</head>
<body>
  <main class="bhiq-page">
    <header class="biq-lede">
      <h1>Behavioral interview questions</h1>
      <p>An interview-prep app: select the principle you want to test, get example questions and guidance.</p>
    </header>
    <section class="bhiq-app" aria-labelledby="bhiq-input-label">
      <div class="bhiq-intro">
        <p>If you already know a listed company's principles, pick that company and use those names. Or type the principle you care about in your own words.</p>
        <p>The over 200 behavioral interview questions in this app are the questions I have used and collected over the years. The examples provided were generated based on dozens of real interview notes and debriefs that I anonymized and fed into an LLM with a tuned prompt.</p>
        <p>Each question includes example answers showing a hire-level answer and a common no-hire answer. Examples change by level on scope, impact metrics, and influence.</p>
      </div>
      <p class="bhiq-level-label" id="bhiq-company-label">Company</p>
      <select id="bhiq-company" class="bhiq-select" aria-labelledby="bhiq-company-label"></select>
      <div id="bhiq-level-block">
      <p class="bhiq-level-label" id="bhiq-level-label">Level</p>
      <div class="bhiq-level" role="radiogroup" aria-labelledby="bhiq-level-label">
        <label><input type="radio" name="bhiq-level" value="junior"> Junior</label>
        <label><input type="radio" name="bhiq-level" value="senior" checked> Senior</label>
        <label><input type="radio" name="bhiq-level" value="exec"> Exec</label>
      </div>
      <div class="bhiq-level-breakdown">
        <p class="bhiq-level-hint"><strong>Junior:</strong> Their own work, local scope, impact in the room they sit in.</p>
        <p class="bhiq-level-hint"><strong>Senior:</strong> Owns the outcome end to end, cites numbers, moves peers and partners.</p>
        <p class="bhiq-level-hint"><strong>Exec:</strong> Sets the bar across orgs, multiplies through other people, the numbers are org-level.</p>
      </div>
      </div>
      <label id="bhiq-input-label" for="bhiq-input">Principle</label>
      <input id="bhiq-input" type="search" autocomplete="off" spellcheck="false" placeholder="Customer Obsession, Earn Trust, BFA">
      <div id="bhiq-chips" class="bhiq-chip-wrap" aria-label="Leadership principles"></div>
      <div id="bhiq-results" class="bhiq-results" aria-live="polite"></div>
    </section>
    <footer class="bhiq-footer">
      <p>To add another company's set, <a href="https://github.com/kindel/principles/issues/new">open an issue on kindel/principles</a>.</p>
    </footer>
  </main>
  <script src="js/biq.js" defer></script>
</body>
</html>