OB
אופיר ברנס
Builder · TLV
חזרה לכל הפרויקטים
PWA · 2026 · Personal Project

Whitenoise

PWA למיקסר רעש פרוצדורלי לפוקוס ושינה — 8 ערוצים נוצרים ב-Web Audio בזמן אמת, בלי קבצי אודיו

Whitenoise

על האפליקציה

Whitenoise הוא מיקסר רעש לרקע — לפוקוס, ללמידה, להירדמות. כל הצלילים נוצרים בזמן אמת באמצעות Web Audio API: לא קבצי mp3 שצריך להוריד, לא תלות בשרת, לא buffering.

8 ערוצים שאפשר לערבב חופשי: רעש לבן, ורוד, חום, גשם, גלי ים, אש בוערת, רעש בית קפה, ורוח.

רעש לבן הוא הבסיס. רעש חום הוא חיבוק. גשם הוא מגן. אתה בוחר את התערובת.

לחצו לנסות בעצמכםofir.zbang.net/whitenoise

האפליקציה רצה כאן בייצור — אפשר להתקין על המסך הבית. עובדת אוף-ליין מהפעם הראשונה, עם Wake Lock כדי שהמסך לא ננעל.

ארבעת סוגי הרעש הבסיסיים

  • רעש לבן — תדרים בעוצמה אחידה — Math.random() * 2 - 1 ב-AudioBuffer לולאתי.
  • רעש ורוד (1/f) — חמים יותר, פחות עוקצני — Paul Kellet's algorithm עם 7 קבועי עיבוד.
  • רעש חום (1/f²) — עמוק ומרגיע — אינטגרציה של white noise (last + 0.02*w / 1.02).
  • כל ה-3 משותפים אותו AudioBuffer של 5 שניות, מולוף בלי תפר.

ארבעה אפקטי סביבה

  • גשם — רעש לבן עם highpass + lowpass + LFO על תדר ה-cutoff (גשם דנס/קליל).
  • גלי ים — רעש חום עם lowpass נמוך + LFO על ה-gain בתדירות 0.12Hz (~8 שניות לגל).
  • אש — רעש חום + LFO + קרקושים אקראיים: setInterval שמייצר sine bursts קצרים (200-1000Hz) עם envelope של 70ms.
  • רוח — bandpass עם Q גבוה + LFO איטי על ה-frequency (0.08Hz) — שריקות שעוברות בין תדרים.
  • קפה — pink noise + bandpass + LFO על תדר ה-bandpass — מדמה rumble + voices.

יכולות מרכזיות

  • 8 ערוצים במקביל — כל ערוץ עם node graph נפרד, מתחבר ל-master gain.
  • Smooth fade in/out — כל activate/deactivate עם linearRampToValueAtTime של 300ms — אפס clicks.
  • Auto-activate on slider drag — מספיק להזיז את הסליידר מ-0, הערוץ נכנס.
  • Master volume — slider שזז עם linear ramp (לא קפיצות).
  • Timer אוטומטי — 15ד׳/30ד׳/שעה/שעתיים, מציג ספירה לאחור.
  • 6 quick presets — שינה (חום+גשם), פוקוס (חום+ורוד), גשם, ים, יער, קפה.
  • שמירת מיקסים מותאמים — IndexedDB עם שם.
  • Wake Lock — מסך לא ננעל בזמן ניגון.

ארכיטקטורת ה-PWA

  • AudioContext + AudioBufferSourceNode עם loop: true — ביצוע יעיל של רעש פרוצדורלי.
  • Pre-generated buffers — white/pink/brown מחושבים פעם אחת ב-init, חוסך CPU בכל activate.
  • BiquadFilter chains — לכל ערוץ filter graph אופייני (highpass→lowpass לגשם, bandpass עם Q גבוה לרוח, וכו').
  • OscillatorNode כ-LFO — מודולציות איטיות של filter freq או gain (גלים, סופות, שריקות).
  • GainNode per channel + master — שליטה גרנולרית.
  • IndexedDB עם presets store — מיקסים מותאמים persistent.
  • Wake Lock + visibilitychange re-acquire.
  • Vanilla JS, אפס תלויות, כ-30KB total.

עיצוב

  • פלטה emerald/forest#34d399 emerald + #6ee7b7 mint + #022c22 deep forest. רקע ירוק-יער עמוק.
  • Channel cards עם indicator bars אנימטיביים בתחתית כל card פעיל.
  • Master pulse — כפתור הניגון פועם הילה כשהוא פעיל.
  • Quick presets — 6 כפתורי emoji-icons לבחירה מהירה.

פרטיות

  • שום דבר לא נשלח לשרת. כל הצלילים נוצרים מקומית.
  • מיקסים נשמרים רק במכשיר ב-IndexedDB.
  • אין רישום, אין tracking.
· TECHNOLOGY ·
PWA Vanilla JS Web Audio API AudioBufferSourceNode (procedural) BiquadFilter chains Oscillator LFO modulation Pink/Brown noise algorithms Wake Lock API IndexedDB Service Worker

פרויקטים קשורים.

· YOUR PROJECT NEXT ·

הפרויקט הבא שלך?

בוא נדבר